body {color:#444444;overflow-x: hidden; background:#fff;} a{color:#444444} a:active,a:hover {color:#58d498} .desc{width: 48%;right: 0;position: absolute;background: url(/template/eyou/pc/picture/productbg.jpg);background-size: cover; height:500px;} .desc1{width: 48%;right: 0;position: absolute;background: url(/template/eyou/pc/picture/productbg1.jpg);background-size: cover; height:500px;} .desc ul{display:flex;flex-direction: column;justify-content: center;height: 500px;} .desc ul li{/* width:100%; *//* flex-wrap:wrap; */padding-left:10%;box-sizing:border-box;} .desc ul li i{color:#01bfb4; font-size:2em; padding-right:.5em;} .desc ul li span{ font-size:1em;color:#FFF;} #obtn{float: left; width: 100%;} .container3, .container2, .container1{ padding-right:15px; padding-left:15px; margin-right: auto; margin-left: auto;} @media (min-width: 768px) { .container{ width: 768px; } .container1{width:768px;} .container2{width:768px;} /*20220214start*/ .container3{width:768px;} /*20220214end*/ } @media (min-width: 1024px) { .container{ width: 1024px; } .container1{width:1024px;} .container2{width:1024px;} /*20220214start*/ .container3{width:1024px;} /*20220214end*/ } @media (min-width: 1230px) { .container{ width: 1230px; } .container1{width:1230px;} .container2{width:1230px;} /*20220214start*/ .container3{width:1230px;} /*20220214end*/ } @media (min-width: 1300px) { .container{ width: 1300px; } .container1{width:1300px;} .container2{width:1300px;} } @media (min-width: 1366px) { .container{ width: 1300px; } .container1{width:1300px;} .container2{width:1100px;} } @media (min-width: 1400px) { .container{width:1400px;} .container1{width:1400px;} } @media (min-width: 1770px) { .container1{width:1770px;} } /*Top*/ #obtn .head{ float:left; width:100%; background: #010f2c; background: rgba(1,15,44,0.9); position:absolute; left:0; top:0; z-index:101; border-bottom: 1px solid #fff; border-bottom: 1px solid rgba(255,255,255,0.1); } #obtn .head.pageHead{background: #fff; box-shadow: 0 3px 15px rgba(0,0,0,0.05); -moz-box-shadow: 0 3px 15px rgba(0,0,0,0.05); -webkit-box-shadow: 0 3px 15px rgba(0,0,0,0.05); } #obtn .logo{ float:left; margin:21px 0 21px 0; width:134px; height:28px; line-height:0;transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .language{float: right; line-height: 74px; color:#ffffff; color:rgba(255,255,255,0.6); font-size: 12px;} #obtn .tel{float: right; line-height: 74px; color:rgba(255,255,255,0.6); font-size: 23px; margin-right:1em;} #obtn .tel a{color:#00d4b2;} #obtn .head.pageHead .language{color:#444;} #obtn .language i{float: left; margin: 0 10px;} #obtn .language a{float: left; font-size: 16px; color:#ffffff; opacity: 0.6;filter:Alpha(opacity=60);} #obtn .head.pageHead .language a{color:#444444} #obtn .head.pageHead .language a:hover, #obtn .language a:hover{color:#58d498;} #obtn .head .dropdown{ font-size: 16px; height: 74px; position: relative; } #obtn .head .dropdown .el-dropdown i{ float:inherit; } #obtn .head .dropdown .el-dropdown i img{ width:1rem; } #obtn .head .dropdown .el-dropdown-menu{ position: absolute; top: 60px; width: 100%; left: 0; z-index: 10; background-color: #FFF; border: 1px solid #EBEEF5; border-radius: 4px; -webkit-box-shadow: 0 2px 12px 0 rgba(0,0,0,.1); box-shadow: 0 2px 12px 0 rgba(0,0,0,.1); } #obtn .head .dropdown .el-dropdown-menu .el-dropdown-menu__item{ width:100%; display:block; font-size: 14px; padding: 0 16px; box-sizing: border-box; cursor: pointer; text-align: center; list-style: none; line-height: 36px; height: 38px; margin: 0; color: #606266; outline: 0; transition:all .3s; } #obtn .head .dropdown .el-dropdown-menu .el-dropdown-menu__item:hover{ background-color:#f9fffe; } #obtn .cloud{float: right; margin: 18px 18px 0 18px;} #obtn .cloud a{float: left; width: 120px; height: 40px; font-size: 16px; line-height: 38px; text-align: center; color:#fff; background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); border-radius:2px; -moz-border-radius:2px; -webkit-border-radius:2px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .cloud a:hover{ background:#0fe9b2; background: -webkit-linear-gradient(left,#33c08a,#5cd499); background: -o-linear-gradient(left,#33c08a,#5cd499); background: -moz-linear-gradient(left,#33c08a,#5cd499); background: -ms-linear-gradient(left,#33c08a,#5cd499); background: linear-gradient(to right,#33c08a,#5cd499); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#33c08a), color-stop(100%,#5cd499)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } /*menu*/ #obtn .menu{float: left; margin:0 30px;} #obtn .menu .nli{ float:left; padding:0; margin:0 0 0 20px; position: relative;} #obtn .menu .nli span a{ float:left; position:relative; padding: 0 19px; color:#fff; font-size:16px; line-height:74px;} #obtn .head.pageHead .menu .nli span a{color:#444444} #obtn .menu .nli span a:after{position: absolute; content: ''; width: 100%; height: 0; background: #58d498; left: 0; bottom: -1px; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(left,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0 ); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .menu .nli.active span a:after, #obtn .menu .nli span:hover a:after{height: 4px;} #obtn .menu .sub{float:left; display: none; position:absolute; left:50%; margin-left: -90px; top:74px; width:180px; z-index:66;} #obtn .menu .sub.proSub{width: 700px; left: 50%;} #obtn .menu .sub .subBox{float: left; width: 100%;background: #16234d; padding: 15px 0 25px 0; margin-top: 20px; position: relative; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px; -webkit-box-shadow: 0 0 24px rgba(0,0,0,0.8); } #obtn .head.pageHead .menu .sub .subBox{background: #fff;} #obtn .menu .sub.proSub .subBox{padding: 30px 0;box-sizing: border-box;} #obtn .menu .sub .subBox:after{ position: absolute; content: ''; left: 50%; margin-left: -10px; top:-10px; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 12px solid #16234d; } #obtn .menu .sub.proSub .subBox:after{left: 80px; margin-left: 0;} #obtn .head.pageHead .menu .sub .subBox:after{border-bottom: 12px solid #fff;} #obtn .menu .sub.proSub .tableBox{float: left;width: 33.33%;padding-left:25px; /***padding-right:20px;**/box-sizing: border-box;position: relative;} #obtn .menu .sub.proSub .tableBox:after{position: absolute; content: ''; width: 1px; height: 100%; border-right: 1px dotted #fff; opacity: 0.1;filter:Alpha(opacity=20);} #obtn .head.pageHead .menu .sub.proSub .tableBox:after{border-right: 1px dotted #444;} #obtn .menu .sub.proSub .tableBox.two:after{border-right: 0;} #obtn .menu .sub li{float: left; width: 100%; text-align:center; margin-top: 10px;} #obtn .menu .sub .subBox1 li{float: left; width: 100%; text-align:left;padding-left: 33.33%; box-sizing: border-box;margin-top: 10px;} #obtn .menu .sub.proSub .tableBox li{text-align: left; margin-top: 14px;} #obtn .menu .sub li a{ float:left; width: 100%; color:#fff; font-size:14px; line-height:38px;opacity: 0.6;filter:Alpha(opacity=60)} #obtn .head.pageHead .menu .sub li a{color:#444;opacity:1;filter:Alpha(opacity=100)} #obtn .menu .sub li a sup{color:#ff0000;} #obtn .menu .sub li.first, #obtn .menu .sub.proSub .tableBox li.first{margin-top: 0;} #obtn .menu .sub li.first a{font-size: 16px; line-height: 45px; font-weight: bold;} #obtn .head.pageHead .menu .sub li.first a{color:#58d498;} #obtn .menu .sub.proSub .tableBox li a{padding-left: 20px;} #obtn .menu .sub li:hover{ background:rgba(0,0,0,0.1);opacity:1;filter:Alpha(opacity=100); color:#58d398;} #obtn .head.pageHead .menu .sub li a:hover{color:#58d498} #obtn .head.on{ box-shadow:0 5px 10px rgba(0,0,0,0.1);} #obtn .head.on .menu .nli span a{ line-height:84px;} #obtn .head.on .menu .sub{ top:84px;} #obtn .head.on .logo{ margin:20px 0;} .siteMap{background: url(/template/eyou/pc/image/siteBg.jpg) no-repeat #475d86;padding: 1em 0;} .siteMap .pageTit,.siteMap .siteMapTit{color: #fff !important;} .siteMap .siteMapTit{text-align: center;margin-top: 1em;font-size: .9em;margin-bottom: 2.5em;} .siteMap .siteMapImg{border: 2px solid #ffffff;border-radius: 5px;background-color: #111827;} .siteMap .siteMapImg img{display:block;width: 100%;padding:1%;box-sizing: border-box;} .siteMap .cloud{ margin: 2em auto !important; float:inherit !important;} .siteMap .cloud a{margin:0 auto;float: none !important;display: block;width: 10em !important;} @media screen and (max-width:480px ){ .siteMap{ padding: 1.5em 0;} } @media screen and (max-width:1200px ) { #obtn .tel{ display: none;} } @media screen and (max-width:1680px ){ #obtn .menu .nli{margin-left: 10px;} #obtn .menu .nli span a{padding: 0 15px;font-size: 16px;} #obtn .cloud{float: right; margin: 18px 15px 0 15px;} #obtn .cloud a{float: left; width: 100px; height: 40px; font-size: 16px; line-height: 40px; text-align: center; color:#fff;} #obtn .language a{float: left; font-size: 16px; color:#ffffff; opacity: 0.6;filter:Alpha(opacity=60);} #obtn .menu {float: left;margin-left: 35px;} #obtn .tel{ display: none;} } @media screen and (max-width:1440px ){ #obtn .menu .nli{margin-left: 10px;} #obtn .menu .nli span a{padding: 0 15px;font-size: 16px;} #obtn .cloud{float: right; margin: 18px 15px 0 15px;} #obtn .cloud a{float: left; width: 100px; height: 40px; font-size: 16px; line-height: 40px; text-align: center; color:#fff;} #obtn .language a{float: left; font-size: 16px; color:#ffffff; opacity: 0.6;filter:Alpha(opacity=60);} #obtn .menu {float: left;margin-left: 25px;} #obtn .tel{ display: none;} } @media screen and (max-width:1399px ){ #obtn .menu .nli{margin-left: 1px;} #obtn .menu .nli span a{padding: 0 15px;font-size: 15px;} #obtn .cloud{float: right; margin: 18px 15px 0 15px;} #obtn .cloud a{float: left; width: 100px; height: 40px; font-size: 15px; line-height: 40px; text-align: center; color:#fff;} #obtn .language a{float: left; font-size: 15px; color:#ffffff; opacity: 0.6;filter:Alpha(opacity=60);} } @media screen and (max-width:1280px ){ #obtn .menu .nli{margin-left: 5px;} #obtn .menu .nli span a{padding: 0 15px;font-size: 15px;} #obtn .cloud{float: right; margin: 18px 15px 0 15px;} #obtn .cloud a{float: left; width: 100px; height: 40px; font-size: 15px; line-height: 40px; text-align: center; color:#fff;} #obtn .language a{float: left; font-size: 15px; color:#ffffff; opacity: 0.6;filter:Alpha(opacity=60);} #obtn .menu {float: left;margin-left: 10px;} } @media screen and (max-width:1229px ){ #obtn .menu{margin-left:15px;} #obtn .menu .nli{margin-left:10px;} #obtn .menu .nli span a{font-size: 14px; padding:0 10px;} #obtn .menu .sub.proSub{width: 400px;} #obtn .menu .sub.proSub .subBox{padding: 30px 0 30px 0;} #obtn .menu .sub.proSub .tableBox{padding-left: 20px; padding-right:15px;} #obtn .menu .sub.proSub .tableBox li{margin-top: 8px;} #obtn .menu .sub .subBox{padding:20px 0;} #obtn .menu .sub li{margin-top: 5px;} #obtn .menu .sub li.first a{font-size: 15px; line-height: 40px;} #obtn .language a{font-size: 15px;} #obtn .cloud{margin: 17px 0 0 25px;} #obtn .cloud a{width: 100px; height: 40px; line-height: 40px;} } @media screen and (max-width:1023px ){ #obtn .menu{ display:none;} #obtn .language{ display:none;} #obtn .logo{margin: 17px 0;} #obtn .language{line-height: 62px;} #obtn .cloud{margin: 12px 20px 0 15px;} #obtn .cloud a{height: 38px; line-height: 38px; font-size: 14px;} } @media screen and (max-width:767px ) { #obtn .cloud{margin: 14px 12px 0 10px;} #obtn .cloud a{width: 80px;height: 34px;line-height: 34px;} #obtn .language a{font-size: 14px;} #obtn .language i{margin: 0 5px;} } @media screen and (max-width:400px ){ #obtn .language{line-height: 0;opacity: 0;} } /*手机导航按钮*/ #obtn .menuph{ display:none; float:right; width:28px; height:22px; cursor: pointer; text-align: center; margin:21px 0 19px 0;} #obtn .menuph .point { display: inline-block; width: 28px; height: 22px; position: relative;} #obtn .menuph .point:hover .navbtn, #obtn .menuph .point:hover .navbtn::after, #obtn .menuph .point:hover .navbtn::before {width: 28px;} #obtn .menuph .navbtn { position: absolute; top: 10px; right: 0; display: inline-block; width: 21px; height: 2px; -webkit-transition: all .3s ease-out 0s; -moz-transition: all .3s ease-out 0s; -ms-transition: all .3s ease-out 0s; -o-transition: all .3s ease-out 0s; transition: all .3s ease-out 0s; background: #58d498; } #obtn .menuph .navbtn::after, #obtn .menuph .navbtn::before { position: absolute; right: 0; display: inline-block; width: 28px; height: 2px; content: ''; -webkit-transition: all .3s ease-out 0s; -moz-transition: all .3s ease-out 0s; -ms-transition: all .3s ease-out 0s; -o-transition: all .3s ease-out 0s; transition: all .3s ease-out 0s; background: #58d498; } #obtn .menuph .navbtn::after { top: -11px; } #obtn .menuph .navbtn::before { top: 10px; } #obtn .menuph .point.active .navbtn{ background: transparent; } #obtn .menuph .point.active .navbtn::after{ -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top: 0px; } #obtn .menuph .point.active .navbtn::before { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top: 0px; } @media screen and (max-width:1023px ){ #obtn .menuph{ display:block;} } /*手机导航*/ #obtn .xialaph.on,#obtn .xialaph .ul2.on{display: block;} #obtn .xialaph{ position:fixed; left:0; top:0; float:left; width: 100%; height:100%; overflow:scroll; padding:60px 0 50px 0; display: none; z-index:66; background:#fff; background:rgba(255,255,255,0.90)} #obtn .xialaph .ul2, #obtn .xialaph .ul3{display: none;} #obtn .xialaph h4{ float:left; width:100%;position: relative; } #obtn .xialaph h4 a{ float:left; width:66%; color: #666666; font-size:16px; line-height:50px; position:relative;} #obtn .xialaph li h4 a i{ float:left; position:absolute; left:0; top:50%; margin-obtn:-10px; width:20px; height:20px;} #obtn .xialaph li:last-child h4::before{ content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: #000; opacity: 0.1; } #obtn .xialaph h4:hover a, #obtn .xialaph h5:hover a{ color: #58d498; } #obtn .xialaph h4::after{ content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background-color: #000; opacity: 0.1; } #obtn .xialaph h5 a{ float:left; width:100%; color: #666666; font-size:14px; line-height: 40px;padding: 0 10px;} #obtn .xialaph h5{ float:left; width:100%;position: relative; } #obtn .xialaph h5::after{ content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 1px; background-color: #000; opacity: 0.1; } #obtn .xialaph li:last-child h5::after{ display: none; } #obtn .xialaph h4 img{ width: 15px; height: 8px; float: right; margin-top:21px; cursor: pointer; } #obtn .xialaph h5 img{ width: 11px; height: 6px; float: right; margin-top:17px; cursor: pointer; } #obtn .xialaph h4.active img.img_s, #obtn .xialaph h5.active img.img_s{ display: none; } #obtn .xialaph h4.active img.img_d, #obtn .xialaph h5.active img.img_d{ display: block; } #obtn .xialaph .ul2{ float:left; width:100%; padding:0 10px;} #obtn .xialaph .img_d{ display: none; } /*手机底部导航*/ #obtn .pf_down{width:100%; float:left; position:fixed; left:0; bottom:0; height:50px; background:#58d498; z-index:66; box-shadow:0 -4px 7px rgba(0,0,0,0.15);} #obtn .pf_down li{ width:25%; float:left; text-align:center; padding:7px 0 4px 0;} #obtn .pf_down li .ico7{ width:100%; float:left; height:20px;} #obtn .pf_down li .ico7 img{ width:20px; height:20px;} #obtn .pf_down li .name{ width:100%; float:left; margin-top:4px; font-size:12px; color:#fff; line-height:14px;} /*banner*/ #obtn .slide_banner{ float:left; width:100%; position:relative; overflow:hidden; text-align:center;font-size: 0; line-height: 0;} #obtn .slide_banner .slick-slide{ width:100%; padding:0; position:relative; line-height:0;} #obtn .slide_banner img{ width:100%;} #obtn .slide_banner .box{position: relative; float: left; width: 100%;} #obtn .slide_banner .box .banBox{position: absolute; left:50%; margin-left: -600px; width:50%; top:50%; margin-top:-92px; text-align: left;} #obtn .slide_banner .box .banBox .hT1{float: left; width:100%; color:#fff; font-size: 56px; line-height:70px; font-weight: bold;} #obtn .slide_banner .box .banBox .butt{float: left; width: 100%;} #obtn .slide_banner .box .banBox .butt a{float: left; width:180px; height:54px; border:1px solid #fff; border:1px solid rgba(255,255,255,0.9); background: #fff; background: rgba(255,255,255,0.1); line-height: 52px; font-size: 16px; text-align: center; margin-top: 60px; color:#fff; ); border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .slide_banner .box .banBox .nongpi a{float: left; width:180px; height:54px; border:1px solid #fff; border:1px solid rgba(146,231,192,0.9); background: #fff; background: rgba(146,231,192,0.5); line-height: 52px; font-size: 16px; text-align: center; margin-top: 60px; color:#24b17c; ); border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .slide_banner .box .banBox .xbutt a{margin: 240px 0px 0px 10px;} @media screen and (max-width:1680px) { #obtn .slide_banner .box .banBox .xbutt a{margin: 220px 0px 0px 80px;} } @media screen and (max-width:1600px) { #obtn .slide_banner .box .banBox .xbutt a{margin: 220px 0px 0px 80px;} } @media screen and (max-width:1440px) { #obtn .slide_banner .box .banBox .xbutt a{margin: 200px 0px 0px 80px;} } #obtn .slide_banner .box .banBox .xbuta a{margin-top: 290px; margin-left: 510px;} #obtn .slide_banner .box .banBox .xbuta a:hover{ border: 1px solid #FFF !important; background: #ffffff !important; color: #f46114 !important; } #obtn .slide_banner .box .banBox .butt a:hover{ border:1px solid #58d498; background: #58d498; color:#fff; } #obtn .slide_banner .slick-prev, #obtn .slide_banner .slick-next{width: 54px; height: 54px; border:1px solid #fff; border:1px solid rgba(255,255,255,0.4); left: 70px; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .slide_banner .slick-next{left: auto;right: 70px;} #obtn .slide_banner .slick-prev:after, #obtn .slide_banner .slick-next:after{position: absolute;content: ''; width: 54px; height: 54px; left: 0; top:0; background: url("_im_g/next1.png") no-repeat; background-size: cover; } #obtn .slide_banner .slick-next:after{background: url("_im_g/prev1.png") no-repeat; background-size: cover;} #obtn .slide_banner .slick-prev:hover, #obtn .slide_banner .slick-next:hover{border:1px solid #58d498; background: #58d498;} #obtn .slide_banner .slick-dots{ height:4px; bottom:60px;} #obtn .slide_banner .slick-dots li{ width:40px; height:4px; margin:0 7px; background:#fdfdfd; text-indent:-9999px; overflow:hidden; vertical-align:top; position: relative; } #obtn .slide_banner .slick-dots li:after{position: absolute; content: ''; width:0; height: 4px;background:#58d398; left: 0; top:0; opacity:1;filter:Alpha(opacity=100); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } @keyframes line { from {width: 0;} to {width: 100%;} } @-moz-keyframes line /* Firefox */ { from {width: 0;} to {width: 100%;} } @-webkit-keyframes line /* Safari 和 Chrome */ { from {width: 0;} to {width: 100%;} } @-o-keyframes line /* Opera */ { from {width: 0;} to {width: 100%;} } #obtn .slide_banner .slick-dots li.slick-active:after{ width: 100%; animation: line 5s; -moz-animation: line 5s; /* Firefox */ -webkit-animation: line 5s; /* Safari 和 Chrome */ -o-animation: line 5s; } @media screen and (max-width:2560px) { #obtn .slide_banner .box .banBox .xbuta a {margin-top: 360px;margin-left: 510px;} } @media screen and (max-width:1920px) { #obtn .slide_banner .box .banBox .xbuta a {margin-top: 290px;margin-left: 510px;} } @media screen and (max-width:1440px) { #obtn .slide_banner .box .banBox .hT1{ font-size: 46px;} #obtn .slide_banner .box .banBox{margin-left: -500px;} #obtn .slide_banner .box .banBox .xbuta a {margin-top: 250px;margin-left: 410px;} } @media screen and (max-width:1399px) { #obtn .slide_banner .box .banBox .hT1{ font-size: 46px;} #obtn .slide_banner .box .banBox{margin-left: -500px;} } @media screen and (max-width:1229px) { #obtn .slide_banner .box .banBox{margin-left: -400px; margin-top: -80px;} #obtn .slide_banner .box .banBox .hT1{font-size: 40px; line-height: 50px;} #obtn .slide_banner .box .banBox .butt a{width: 160px; height:50px; line-height: 48px;} #obtn .slide_banner .slick-dots{bottom: 40px;} #obtn .slide_banner .slick-prev, #obtn .slide_banner .slick-next{left: 50px;} #obtn .slide_banner .slick-next{left: auto; right: 50px;} } @media screen and (max-width:1023px) { #obtn .slide_banner .box .banBox{margin-left: -300px; margin-top: -65px;} #obtn .slide_banner .box .banBox .hT1{font-size: 30px; line-height: 40px;} #obtn .slide_banner .box .banBox .butt a{margin-top: 40px;height: 45px; line-height: 43px; font-size: 15px;} #obtn .slide_banner .slick-prev, #obtn .slide_banner .slick-next{width: 45px; height: 45px;} #obtn .slide_banner .slick-prev::after, #obtn .slide_banner .slick-next::after {width: 45px; height: 45px;} } @media screen and (max-width:767px) { #obtn .slide_banner .box .banBox{ left:60px; width:80%;margin-left:0; margin-top: -25px;} #obtn .slide_banner .box .banBox .hT1{font-size:22px; line-height: 30px;} #obtn .slide_banner .box .banBox .butt a{width: 130px; margin-top:20px;height:35px; line-height: 33px; font-size: 14px;} #obtn .slide_banner .box .banBox .xbutt a{width: 100px;margin-top: 75px;height: 30px;line-height: 30px;margin-left: -7px;} #obtn .slide_banner .slick-dots{bottom: 20px; height: 3px;} #obtn .slide_banner .slick-dots li{height: 3px; width: 30px; margin: 0 5px;} #obtn .slide_banner .slick-dots li.slick-active:after{height: 3px; width: 30px;} #obtn .slide_banner .slick-prev, #obtn .slide_banner .slick-next{width: 35px; height: 35px; left: 10px;z-index: 50;} #obtn .slide_banner .slick-next{left: auto; right: 10px;} #obtn .slide_banner .slick-prev:after, #obtn .slide_banner .slick-next:after{width:35px; height:35px;} } /*首页 解决方案*/ #obtn .homeSolution{float: left; width: 100%; margin:58px 0 74px 0;} #obtn .homeTit{float: left; width: 100%; text-align: center; color:#444444; font-size: 28px; line-height: 60px;} #obtn .hSolutionIco{float: left; width: 100%; padding: 0 105px; margin-top: 6px;} #obtn .hSolutionIco .tIco{float: left; width: 100%; text-align: center; line-height: 0; margin-top: 20px; cursor: pointer} #obtn .hSolutionIco .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; width: 50%; display: block; margin: 2em auto 1em; } #obtn .hSolutionIco .slick-slide:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .hSolutionIco .dText{float: left; width: 100%; text-align: center; line-height: 44px; font-size: 16px; color:#444444; padding-bottom: 6px; position: relative;cursor: pointer} #obtn .hSolutionIco .slick-slide.slick-current .dText:after{position: absolute; content: ''; width: 110px; height: 4px; left: 50%; margin-left: -55px; bottom: 0; background: #0ccede;} #obtn .hSolutionText{float: left; width: 100%; margin-top: 20px;} #obtn .hSolutionText .slick-list{padding: 15px 10px;} #obtn .hSolutionText .li1{float: left; width: 100%; background: #fff; padding: 54px 6%; box-shadow: 0 0 21px rgba(212,215,220,0.3); -moz-box-shadow: 0 0 21px rgba(212,215,220,0.3); -webkit-box-shadow: 0 0 21px rgba(212,215,220,0.3); } #obtn .hSolutionText .li1 .leftText{float: left; width:30%;} #obtn .hSolutionText .li1 .leftText .tH1{float: left; width: 100%; margin-top: 24px; font-size: 22px; color:#444444; line-height: 50px; padding-bottom: 21px; position: relative} #obtn .hSolutionText .li1 .leftText .tH1:after{position: absolute; content: ''; width: 60px; height: 3px; background: #0ccede; left: 0; bottom: 0;} #obtn .hSolutionText .li1 .leftText .p1{float: left; width: 100%; color:#777777; font-size: 15px; line-height: 30px; margin-top: 28px;} #obtn .hSolutionText .li1 .leftText .more{float: left; width: 100%; margin-top: 40px; line-height: 35px;} #obtn .hSolutionText .li1 .leftText .more a{float: left; font-size: 16px; line-height: 35px;} #obtn .hSolutionText .li1 .leftText .more a span{float: left; margin-right: 8px; color: #00c1b3;} #obtn .hSolutionText .li1 .leftText .more a span:hover{color:#fff;} #obtn .hSolutionText .li1 .leftText .more a i{float: left; width:16px; height:2px; color: #0ccede; background:#0ccede; position:relative; margin: 17px auto; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .hSolutionText .li1 .leftText .more a i:after, #obtn .hSolutionText .li1 .leftText .more a i:before{float:left; width:7px; height:2px; background:#58d398; content:''; position:relative; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .hSolutionText .li1 .leftText .more a i:after{ -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top:3px; right:-2px; } #obtn .hSolutionText .li1 .leftText .more a i:before{ -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top:-3px; right:-9px;} #obtn .hSolutionText .li1 .leftText .more a:hover{background: #0ccede; color:#fff; padding: 0 30px;} #obtn .hSolutionText .li1 .leftText .more a:hover i{background: #fff;} #obtn .hSolutionText .li1 .leftText .more a:hover i:after, #obtn .hSolutionText .li1 .leftText .more a:hover i:before{background:#fff;} #obtn .hSolutionText .li1 .rightImg{float: right; width:62.43%; line-height: 0;} @media screen and (max-width:1399px) { #obtn .hSolutionText .li1 .leftText{width: 34%;} #obtn .hSolutionText .li1{padding: 45px 5%;} #obtn .hSolutionText .li1 .leftText .tH1{margin-top: 0; padding-bottom: 15px;} #obtn .hSolutionText .li1 .leftText .more{margin-top: 25px;} } @media screen and (max-width:1229px) { #obtn .homeSolution{margin: 65px 0 60px 0;} #obtn .homeTit{font-size: 28px; line-height: 45px;} #obtn .hSolutionIco{padding: 0 50px; margin-top: 20px;} #obtn .hSolutionIco .dText{font-size: 16px;} #obtn .hSolutionText{margin-top: 30px;} #obtn .hSolutionText .li1 .leftText .tH1{font-size: 22px; line-height: 35px;} #obtn .hSolutionText .li1 .leftText .p1{margin-top: 15px; font-size: 14px; line-height: 26px;} } @media screen and (max-width:1023px) { #obtn .homeSolution{margin:50px 0;} #obtn .hSolutionIco{padding: 0;} #obtn .hSolutionIco .tIco{margin-top: 10px;} #obtn .hSolutionIco .tIco img{/* width: 40px; *//* height: 40px; */} #obtn .hSolutionIco .dText{font-size: 14px; line-height: 35px;} #obtn .hSolutionIco .slick-slide.slick-current .dText:after{width: 90px; margin-left: -45px; height: 3px;} #obtn .hSolutionText{margin-top: 20px;} #obtn .hSolutionText .li1{padding: 30px 5%;} #obtn .hSolutionText .li1 .leftText{width: 100%;} #obtn .hSolutionText .li1 .leftText .more{margin-top: 15px;} #obtn .hSolutionText .li1 .rightImg{width: 100%; margin-top: 15px;} } @media screen and (max-width:767px) { #obtn .homeSolution{margin:30px 0 35px 0;} #obtn .homeTit{font-size: 24px; line-height: 35px;} #obtn .hSolutionIco .tIco{margin-top: 0;} #obtn .hSolutionIco .tIco img{/* width: 35px; *//* height: 35px; */margin: 1em auto;} #obtn .hSolutionIco .slick-slide.slick-current .dText:after{height: 2px;} #obtn .hSolutionText{margin-top: 10px;} #obtn .hSolutionText .li1{padding: 15px;} #obtn .hSolutionText .li1 .leftText .tH1{font-size:18px; padding-bottom: 10px;} #obtn .hSolutionText .li1 .leftText .tH1:after{ height: 2px; width: 50px;} #obtn .hSolutionText .li1 .leftText .more a{font-size: 15px;} #obtn .hSolutionText .li1 .rightImg{margin-top:10px;} } /*首页-可视化*/ #obtn .VisualizingBox{float: left; width: 100%; background: #0d1547; position:relative;} #obtn .VisualizingBG{position: absolute; left:0; top:0; width: 100%; height: 100%; /**opacity: 0.05;filter:Alpha(opacity=5);**/} #obtn .homeVisInfo{float: left; width: 100%; margin: 60px 0 0 0; position: relative; z-index: 2;} #obtn .homeVisInfo .homeTit{color:#00bab4;} #obtn .homeVisVideo{float: left; width: 100%; margin-top: -5px; position: relative;} #obtn .homeVisVideo:after{position: absolute; content: ''; width: 120px; height: 5px; background: #0ccede; top:-1px; left: 50%; margin-left: -60px; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; box-shadow: 0 0 7px rgba(0,228,255,0.35); -moz-box-shadow: 0 0 7px rgba(0,228,255,0.35); -webkit-box-shadow: 0 0 7px rgba(0,228,255,0.35); } #obtn .homeVisVideo .videoBox{float: left; width: 100%;} #obtn .homeVisVideo .videoBox .top{float: left; width: 100%; padding: 30px 3.5%; background:url("_im_g/main10.png") center; background-size:100% 100%; filter:Alpha(opacity=80); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeVisVideo .videoBox .top:hover{opacity:1;filter:Alpha(opacity=100); box-shadow: 0 0 10px rgba(0,228,255,0.4); -moz-box-shadow: 0 0 10px rgba(0,228,255,0.4); -webkit-box-shadow: 0 0 10px rgba(0,228,255,0.4); } #obtn .homeVisVideo .videoBox .hVideo{float: left; width: 100%; position: relative; z-index: 3;} #obtn .homeVisVideo .videoBox .hVidBox{position: absolute; width: 100%; height: 100%; left: 0; top:0; background: #010e42; background: rgba(1,14,66,0.3); cursor: pointer; z-index:3;} #obtn .homeVisVideo .videoBox .hVideo video{float: left; width: 100%; z-index:4; position:relative;} #obtn .homeVisVideo .videoBox .hVidBox span{position: absolute; width: 72px; height: 72px; left: 50%; margin-left: -36px; top:50%; margin-top: -36px; line-height: 0;opacity: 0.7;filter:Alpha(opacity=70);} #obtn .homeVisVideo .videoBox .more{float: left; width: 100%; margin-top: 20px; display: block; text-align: center} #obtn .homeVisVideo .videoBox .more a{ display: inline-block; width: 180px; height: 50px; background-color: #00d2af; background-image: linear-gradient(to bottom right, #00d2af , #00bab4); line-height: 50px; color:#fff; font-size: 16px; position: relative; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeVisVideo .videoBox .more a:before { content: '';position: absolute;top: -20px;left: -20px;bottom: -20px;right: -20px;background: inherit;border-radius: 50px;z-index: -1;opacity: 0.4; -webkit-transform: scale3d(0.8, 0.5, 1); -moz-transform: scale3d(0.8, 0.5, 1); -o-transform: scale3d(0.8, 0.5, 1); transform: scale3d(0.8, 0.5, 1); } #obtn .homeVisVideo .videoBox .more a:hover { -webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s; transition: background-color 0.1s 0.3s, color 0.1s 0.3s; color: #fff; background-color: #58d498; -webkit-animation: anim-moema-1 0.3s forwards; -moz-animation: anim-moema-1 0.3s forwards; -o-animation: anim-moema-1 0.3s forwards; animation: anim-moema-1 0.3s forwards; } #obtn .homeVisVideo .videoBox .more a:hover:before { -webkit-animation: anim-moema-2 0.3s 0.3s forwards; -moz-animation: anim-moema-2 0.3s 0.3s forwards; -o-animation: anim-moema-2 0.3s 0.3s forwards; animation: anim-moema-2 0.3s 0.3s forwards; } @-webkit-keyframes anim-moema-1 { 60% { -webkit-transform: scale3d(0.8, 0.8, 1); transform: scale3d(0.8, 0.8, 1); } 85% { -webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes anim-moema-1 { 60% { -webkit-transform: scale3d(0.8, 0.8, 1); transform: scale3d(0.8, 0.8, 1); } 85% { -webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @-webkit-keyframes anim-moema-2 { to { opacity: 0; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes anim-moema-2 { to { opacity: 0; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } #obtn .homeVisTitle{position: absolute; z-index: 99; right:40px; width: 195px; top:100px;} #obtn .videoTitBox{float:left; width: 100%; color:#000;font-size: 16px; line-height: 55px; margin-top: 48px; padding-right: 45px;position: relative; cursor: pointer; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; white-space:nowrap; } #obtn .videoTitBox:after{position: absolute; content: ''; right: 0; top:50%; width:20px; height: 1px; background: #fff; opacity: 0.7;filter:Alpha(opacity=70); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeVisTitle .videoTitBox:hover, #obtn .homeVisTitle .slick-slide.slick-current .videoTitBox{color:#00bab4; font-weight: bold;} #obtn .homeVisTitle .videoTitBox:hover:after, #obtn .homeVisTitle .slick-slide.slick-current .videoTitBox:after{ width: 40px; height: 3px; margin-top: -1px; background: #01e2b0;} @media screen and (max-width:1921px) { #obtn .homeVisTitle{position:static;right: 0;top:0;float: left;height: auto;width: 100%;} #obtn .homeVisTitle .slick-list{width: 70%;margin: 0 auto;height: 100px !important;} #obtn .videoTitBox{padding-right: 0; text-align: center; margin-top: 15px;} #obtn .videoTitBox:after{top:auto; bottom: 0; right: auto; left: 50%; margin-left: -10px;} #obtn .homeVisTitle .videoTitBox:hover:after, #obtn .homeVisTitle .slick-slide.slick-current .videoTitBox:after{height: 3px; background: #00bab4; margin-left: -20px;} .slick-vertical .slick-slide{ width: 16.5% !important;} } @media screen and (max-width:1600px) { #obtn .homeVisTitle{position:static;right: 0;top:0;float: left;height: auto;width: 100%;} #obtn .homeVisTitle .slick-list{width: 80%;margin: 0 auto;height: 100px !important;} #obtn .videoTitBox{padding-right: 0; text-align: center; margin-top: 30px;} #obtn .videoTitBox:after{top:auto; bottom: 0; right: auto; left: 50%; margin-left: -10px;} #obtn .homeVisTitle .videoTitBox:hover:after, #obtn .homeVisTitle .slick-slide.slick-current .videoTitBox:after{height: 3px; background: #0ccede; margin-left: -20px;} .slick-vertical .slick-slide{ width: 16.5% !important;} } @media screen and (max-width:1441px) { #obtn .homeVisTitle{position:static;right: 0;top:0;float: left;height: auto;width: 100%;} #obtn .homeVisTitle .slick-list{width: 80%;margin: 0 auto;height: 100px !important;} #obtn .videoTitBox{padding-right: 0; text-align: center; margin-top: 30px;} #obtn .videoTitBox:after{top:auto; bottom: 0; right: auto; left: 50%; margin-left: -10px;} #obtn .homeVisTitle .videoTitBox:hover:after, #obtn .homeVisTitle .slick-slide.slick-current .videoTitBox:after{height: 3px; background: #0ccede; margin-left: -20px;} .slick-vertical .slick-slide{ width: 16.5% !important;} } @media screen and (max-width:1399px) { #obtn .homeVisTitle{position:static; right: 0; top:0;float: left; width: 100%;} #obtn .homeVisTitle .slick-list{padding: 0 100px; width: 100%; box-sizing: border-box;} #obtn .videoTitBox{padding-right: 0; text-align: center; margin-top: 30px;} #obtn .videoTitBox:after{top:auto; bottom: 0; right: auto; left: 50%; margin-left: -10px;} #obtn .homeVisTitle .videoTitBox:hover:after, #obtn .homeVisTitle .slick-slide.slick-current .videoTitBox:after{height: 3px; background: #0ccede; margin-left: -20px;} } @media screen and (max-width:1229px) { #obtn .homeVisInfo{margin: 70px 0 60px 0;} #obtn .homeVisVideo{margin-top:40px;} #obtn .videoTitBox{font-size: 15px;} #obtn .homeVisVideo .videoBox .more{margin-top: 50px;} } @media screen and (max-width:1023px) { #obtn .homeVisInfo{margin: 55px 0 50px 0;} #obtn .homeVisVideo{margin-top: 30px;} #obtn .homeVisTitle .slick-list{padding: 0 50px;} #obtn .videoTitBox{margin-top: 20px;line-height: 50px; font-size: 14px;} #obtn .homeVisVideo .videoBox .more{margin-top: 35px;} #obtn .homeVisVideo .videoBox .more a{width: 160px; height: 40px; font-size: 15px; line-height: 40px;} #obtn .homeVisVideo .videoBox .hVidBox span{width: 40px; height: 40px; margin-left: -20px; margin-top: -20px;} } @media screen and (max-width:767px) { #obtn .homeVisInfo{margin: 30px 0 35px 0;} #obtn .homeVisTitle .slick-list{padding: 0 15px;} #obtn .videoTitBox{margin-top: 10px; line-height:40px;} #obtn .homeVisVideo{margin-top: 25px;} #obtn .homeVisVideo:after{width: 80px; height: 4px; margin-left: -40px;} #obtn .homeVisVideo .videoBox .top{padding: 20px 5%;} #obtn .homeVisVideo .videoBox .more{margin-top: 25px;} } /*首页-产品与服务*/ #obtn .homeProduct{float: left; width: 100%; margin: 60px 0 100px 0;} #obtn .homeProductList{float: left; width: 100%;margin-top: 30px;} #obtn .homeProductList .hd{float: left; width: 100%;} #obtn .homeProductList .hd .u1{float: left; width: 100%; display: block; border-bottom: 1px solid #e6e6e6; padding-bottom: 23px; text-align: center;} #obtn .homeProductList .hd .u1 .l1{display: inline-block; margin: 0 45px; color:#9a9eac; font-size: 18px; line-height: 30px; position: relative; cursor: pointer;} #obtn .homeProductList .hd .u1 .l1.on{color:#05bab5} #obtn .homeProductList .hd .u1 .l1.on:after{position: absolute; content: ''; width: 80px; height:4px; left: 50%; margin-left: -40px; bottom: -26px; background: #04cca8;} #obtn .homeProductList .bd{float: left; width: 100%; margin-top: 20px;} #obtn .homeProductList .bd .list{float: left; width: 100%;} #obtn .homeProductList .bd .list .li2{ float:left; width:19.3%; position:relative; overflow:hidden; cursor: pointer;} #obtn .homeProductList .bd .list .li2 .img{ float:left; width:100%; height:500px; -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; transition: -webkit-transform 2s; vertical-align:middle; -ms-interpolation-mode:bicubic; } #obtn .homeProductList .bd .list .li2:hover .img{ -webkit-transform: scale(1.1); -moz-transform: scale(1.1);transform: scale(1.1);} #obtn .homeProductList .bd .list .li2 .layer{position: absolute; left: 0; top:0; width: 100%; height: 100%;} #obtn .homeProductList .bd .list .li2 .layer .hBusBg1{position:absolute; width: 100%; height: 100%; left: 0; top:0; background: #0b1b3e; opacity: 0.5;filter:alpha(opacity=50); z-index: 1; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeProductList .bd .list .li2 .layer .p1{position: absolute; width: 100%; z-index: 3; left: 0; bottom: 20px; -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } #obtn .homeProductList .bd .list .li2 .layer .p1 .box{display: block;text-align: center; width: 100%;} #obtn .homeProductList .bd .list .li2 .layer .p1 span{display:inline-block; color:#fff; font-size: 16px;height: 35px; line-height: 35px; padding-left: 15px; position: relative;} #obtn .homeProductList .bd .list .li2 .layer .p1 span:after{position: absolute; content: ''; width: 6px; height: 6px; left: 0; top:50%; margin-top: -3px; background: #59d398; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } #obtn .homeProductList .bd .list .li2.on .hBusBg1, #obtn .homeProductList .bd .list .li2:hover .hBusBg1{width: 52%;left: 0;top:0;} #obtn .homeProductList .bd .list .li2.on .layer .p1, #obtn .homeProductList .bd .list .li2:hover .layer .p1{opacity: 0;filter:alpha(opacity=0);} #obtn .homeProductList .bd .list .li2 .p2{ position: absolute; left: 12%; width: 140px; top:50%; margin-top:0; z-index: 6; opacity: 0; filter:alpha(opacity=0); -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } #obtn .homeProductList .bd .list .li2.on .p2, #obtn .homeProductList .bd .list .li2:hover .p2{margin-top: -53px; opacity: 1;filter:alpha(opacity=100); } #obtn .homeProductList .bd .list .li2 .p2 .topTit{float: left;width: 100%; text-align: center; font-size: 16px; line-height: 40px; color:#fff;} #obtn .homeProductList .bd .list .li2 .p2 a{ float: left; width: 100%; margin-top: 22px; color:#fff; font-size: 16px; text-align: center; height: 44px; line-height: 44px; position: relative; background-color: #00bbae; background-image: linear-gradient(to bottom right, #00d2af , #00bab4); border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .homeProductList .bd .list .li2 .p2 a:before { content: '';position: absolute;top: -20px;left: -20px;bottom: -20px;right: -20px;background: inherit;border-radius: 50px;z-index: -1;opacity: 0.4; -webkit-transform: scale3d(0.8, 0.5, 1); -moz-transform: scale3d(0.8, 0.5, 1); -o-transform: scale3d(0.8, 0.5, 1); transform: scale3d(0.8, 0.5, 1); } #obtn .homeProductList .bd .list .li2 .p2 a:hover { -webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s; transition: background-color 0.1s 0.3s, color 0.1s 0.3s; color: #fff; background-color: #58d498; -webkit-animation: anim-moema-1 0.3s forwards; -moz-animation: anim-moema-1 0.3s forwards; -o-animation: anim-moema-1 0.3s forwards; animation: anim-moema-1 0.3s forwards; } #obtn .homeProductList .bd .list .li2 .p2 a:hover:before { -webkit-animation: anim-moema-2 0.3s 0.3s forwards; -moz-animation: anim-moema-2 0.3s 0.3s forwards; -o-animation: anim-moema-2 0.3s 0.3s forwards; animation: anim-moema-2 0.3s 0.3s forwards; } #obtn .homeProductList .bd .list .li2.on{ width:42.1%;} #obtn .homeProductList .bd .list .li2.on .desc{ display:block;} #obtn .homeProductList .bd .list .li2 .desc{ display:none;} #obtn .homeProductList .bd .ptBox .list.box1 .li2.on{width:61.4%} @media screen and (max-width:1399px) { #obtn .homeProduct{ margin: 80px 0 90px 0;} #obtn .homeProductList{margin-top: 40px;} } @media screen and (max-width:1229px) { #obtn .homeProduct{ margin: 70px 0 80px 0;} #obtn .homeProductList{margin-top: 30px;} #obtn .homeProductList .hd .u1 .l1{font-size: 20px; line-height: 45px;} #obtn .homeProductList .bd{margin-top: 45px;} #obtn .homeProductList .bd .list .li2 .layer .p1 span{font-size: 16px;} #obtn .homeProductList .bd .list .li2 .p2 .topTit{font-size: 16px;} } @media screen and (max-width:1023px) { #obtn .homeProduct{ margin: 50px 0 60px 0;} #obtn .homeProductList{margin-top: 20px;} #obtn .homeProductList .hd .u1{padding-bottom: 15px;} #obtn .homeProductList .hd .u1 .l1{margin: 0 20px; font-size: 18px;} #obtn .homeProductList .hd .u1 .l1.on:after {bottom: -15px;} #obtn .homeProductList .bd{margin-top: 35px;} } @media screen and (max-width:767px) { #obtn .homeProduct{ margin:30px 0 35px 0;} #obtn .homeProductList .hd .u1{padding-bottom: 10px;} #obtn .homeProductList .hd .u1 .l1{font-size: 16px; line-height: 30px; margin: 0 10px;} #obtn .homeProductList .hd .u1 .l1.on:after{width: 50px; margin-left: -25px; height: 3px; bottom: -11px;} #obtn .homeProductList .bd{margin-top: 20px;} #obtn .homeProductList .bd .list .li2.on, #obtn .homeProductList .bd .list .li2:hover, #obtn .homeProductList .bd .list .li2{width: 100%;} #obtn .homeProductList .bd .list .li2 .img{height: 120px;} #obtn .homeProductList .bd .ptBox .list.box1 .li2.on, #obtn .homeProductList .bd .list .li2.on .hBusBg1, #obtn .homeProductList .bd .list .li2:hover .hBusBg1{width: 100%;} #obtn .homeProductList .bd .list .li2.on .p2, #obtn .homeProductList .bd .list .li2:hover .p2{left: 50%; margin-left: -70px; margin-top: -40px;} #obtn .homeProductList .bd .list .li2 .p2 .topTit{line-height: 35px;} #obtn .homeProductList .bd .list .li2 .p2 a{margin-top: 10px; height: 38px; line-height: 38px; font-size: 14px;} #obtn .homeProductList .bd .list.box1 .li2 .img{height: 160px;} } @media screen and (max-width:768px){ #obtn .homeProductList .bd .list .li2 .p2{ left:25%} #obtn .homeProductList .bd .list .li2.on .desc{ display:none;} #obtn .homeProductList .bd .list .li2 .desc{ display:none;} #obtn .homeProductList .bd .list .li2.on .hBusBg1, #obtn .homeProductList .bd .list .li2:hover .hBusBg1{ width:100%;} } /*首页-案例*/ #obtn .homeCaseBox{float: left; width: 100%; background: #eaf5ff;position: relative} #obtn .homeCaseBg{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity: 0.55;filter:alpha(opacity=55);} #obtn .homeCaseInfo{float: left; width: 100%; margin: 100px 0; position: relative; z-index: 4;} #obtn .homeCaseInfo .leftCaseIco{float: left; width: 23.5%; padding: 80px 30px 90px 30px; background: #58d498; background: -webkit-linear-gradient(40deg,#04c0f0,#17e8be); background: -o-linear-gradient(40deg,#04c0f0,#17e8be); background: -moz-linear-gradient(40deg,#04c0f0,#17e8be); background: -ms-linear-gradient(40deg,#04c0f0,#17e8be); background: linear-gradient(40deg,#00bab4,#00d2af); background: -webkit-gradient(linear, top left, top bottom, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0 ); box-shadow: 0 0 35px rgba(24,34,64,0.35); -moz-box-shadow: 0 0 35px rgba(24,34,64,0.35); -webkit-box-shadow: 0 0 35px rgba(24,34,64,0.35); border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeCaseInfo .hCaseTit{float: left; width: 100%; color:#fff; font-size: 30px; line-height: 52px;} #obtn .homeCaseInfo .p3{float: left; width: 100%; margin-top: 21px; color:#ffffff; font-size: 16px;line-height: 32px;} #obtn .homeCaseInfo .leftIcoList{float: left; width: 100%; margin-top: 12px;} #obtn .homeCaseInfo .leftIcoList ul{margin: 0 -8px;} #obtn .homeCaseInfo .leftIcoList li{float: left; width: 50%; padding: 0 8px; margin-top:16px;} #obtn .homeCaseInfo .leftIcoList li span{float: left; width:100%; background: #fff; background: rgba(255,255,255,0.2); color:#fff; font-size: 14px; line-height: 50px; text-align: center; /***cursor: pointer;**/ border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeCaseInfo .leftIcoList li.on span, #obtn .homeCaseInfo .leftIcoList li span:hover{ /**background: #fff;***/ color:#FFF; } #obtn .homeCaseInfo .more{float: left; width: 100%; margin-top: 32px;} #obtn .homeCaseInfo .more a{float: left; width: 100%; height: 50px; line-height: 50px; text-align: center; color:#00bab4; font-size: 16px; background: #fff; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeCaseInfo .more a:hover{ color:#00bab4; background: #FFF; } #obtn .homeCaseInfo .rightCaseList{float: right; width: 73%;} #obtn .homeCaseInfo .rightCaseList .ul1{margin: 0 -11px;} #obtn .homeCaseInfo .rightCaseList .ul1 li{float: left; width: 20%; margin-bottom: 7px; padding: 0 5px;} #obtn .homeCaseInfo .rightCaseList .ul1 li span{float: left; width: 100%; line-height: 0; background: #fff; overflow: hidden; cursor: pointer; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; } #obtn .homeCaseInfo .rightCaseList .ul1 li span img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeCaseInfo .rightCaseList .ul1 li span:hover img{ transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1); } @media screen and (max-width:1399px) { #obtn .homeCaseInfo{margin: 80px 0;} #obtn .homeCaseInfo .leftCaseIco { padding: 60px 30px 66px 30px;} } @media screen and (max-width:1229px) { #obtn .homeCaseInfo{margin: 70px 0;} #obtn .homeCaseInfo .leftCaseIco{padding:25px 20px;} #obtn .homeCaseInfo .hCaseTit{font-size: 28px; line-height: 40px;} #obtn .homeCaseInfo .p3{font-size: 16px; margin-top: 15px;} #obtn .homeCaseInfo .leftIcoList ul{margin: 0 -5px;} #obtn .homeCaseInfo .leftIcoList li{padding:0 5px; margin-top: 10px;} #obtn .homeCaseInfo .leftIcoList li span{font-size: 14px; height: 45px; line-height: 45px;} #obtn .homeCaseInfo .more{margin-top: 25px;} #obtn .homeCaseInfo .more a{height: 45px; line-height: 45px;} } @media screen and (max-width:1023px) { #obtn .homeCaseInfo{margin: 55px 0;} #obtn .homeCaseInfo .leftCaseIco{width: 100%;padding: 20px;} #obtn .homeCaseInfo .hCaseTit{font-size: 24px; line-height: 30px;} #obtn .homeCaseInfo .hCaseTit p{float: left;} #obtn .homeCaseInfo .p3{margin-top: 5px;} #obtn .homeCaseInfo .leftIcoList{margin-top:5px;} #obtn .homeCaseInfo .leftIcoList li{width:16.6666%;} #obtn .homeCaseInfo .more{margin-top: 15px;} #obtn .homeCaseInfo .rightCaseList{width: 100%;} } @media screen and (max-width:767px) { #obtn .homeCaseInfo{margin: 35px 0;} #obtn .homeCaseInfo .leftCaseIco{padding: 15px;} #obtn .homeCaseInfo .hCaseTit{font-size: 20px;} #obtn .homeCaseInfo .p3{font-size: 14px;} #obtn .homeCaseInfo .leftIcoList li{width: 33.3333%;} #obtn .homeCaseInfo .leftIcoList li span{height: 40px; line-height: 40px;} #obtn .homeCaseInfo .more a{height: 40px; line-height: 40px;} #obtn .homeCaseInfo .rightCaseList{margin-top: 10px;} #obtn .homeCaseInfo .rightCaseList .ul1{margin: 0 -5px;} #obtn .homeCaseInfo .rightCaseList .ul1 li{padding:0 5px; margin-top: 15px; width: 25%;} } /*首页-优势*/ #obtn .homeAdvantage{float: left; width: 100%; margin: 60px 0 93px 0;} #obtn .homeAdvList{float: left; width: 100%; margin-top: 58px;} #obtn .homeAdvList li{ float: left; width: 20%; background: #fff; /* box-shadow: 0 0 24px rgba(140,149,169,0.3); */ -moz-box-shadow: 0 0 24px rgba(140,149,169,0.3); /* -webkit-box-shadow: 0 0 24px rgba(140,149,169,0.3); */ /* transition: all 0.5s linear; */ -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeAdvList li:hover{position: relative; z-index: 2;} #obtn .homeAdvList li .tIco{float: left;width: 100%;text-align: center;margin-top: 1em;margin-bottom: 1.5em;line-height: 0;} #obtn .homeAdvList li .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; width: 45%; } #obtn .homeAdvList li:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .homeAdvList li .tH1{float: left; width: 100%; text-align:center; color:#444444; font-size: 18px; line-height: 40px; font-weight: bold; padding-bottom: 10px; position: relative; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeAdvList li:hover .tH1{ color:#00bab4; } #obtn .homeAdvList li .tH1:after{position: absolute; content: ''; width: 30px; height: 2px;left: 50%; margin-left: -15px; bottom: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeAdvList li .dText{float: left; width: 100%; margin: 19px 0 21px 0; padding: 0 35px; color:#666666; font-size: 14px; line-height: 30px; height: 150px; text-align: center;} #obtn .homeAdvList li:hover .tH1:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } @media screen and (max-width:1229px) { #obtn .homeAdvantage{margin: 60px 0 70px 0;} #obtn .homeAdvList{margin-top: 45px;} #obtn .homeAdvList li .tIco{margin-top: 60px;} #obtn .homeAdvList li .dText{font-size: 15px; padding: 0 25px;} } @media screen and (max-width:1023px) { #obtn .homeAdvantage{margin: 50px 0 55px 0;} #obtn .homeAdvList{margin-top: 35px;} #obtn .homeAdvList li .tIco{margin-top: 45px;} #obtn .homeAdvList li .tIco img{width: 55px; height: 55px;} #obtn .homeAdvList li .tH1{font-size: 18px; line-height: 35px;} #obtn .homeAdvList li .dText{font-size: 14px; padding: 0 15px; line-height: 24px; height: 120px;} } @media screen and (max-width:767px) { #obtn .homeAdvantage{margin:30px 0 35px 0;} #obtn .homeAdvList{margin-top: 25px;} #obtn .homeAdvList li{width: 100%; padding-left:80px; position: relative;} #obtn .homeAdvList li .tIco{width:70px; float: none; position: absolute; left:5px; top:50%; margin-top: -35px;} #obtn .homeAdvList li .tH1{text-align: left; margin-top: 15px;} #obtn .homeAdvList li .tH1:after{left: 0; margin-left: 0;} #obtn .homeAdvList li .dText{text-align: left; padding: 0 10px 0 0; height: auto; margin:10px 0 15px 0;} } /*首页-新闻*/ #obtn .homeNewsBox{float: left; width: 100%; background: #f4fafe;} #obtn .homeNewsInfo{float: left; width: 100%; margin: 60px 0 79px 0} #obtn .homeNewsList{float: left; width: 100%; margin-top:36px} #obtn .homeNewsList ul{margin: 0 -24px;} #obtn .homeNewsList li{float: left; width: 33.3333%; margin-top: 20px; padding: 0 24px;} #obtn .homeNewsList li .newsWord{float: left; width: 100%; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeNewsList li .newsWord:hover{ box-shadow: 0 0 13px rgba(106,137,177,0.3); -moz-box-shadow: 0 0 13px rgba(106,137,177,0.3); -webkit-box-shadow: 0 0 13px rgba(106,137,177,0.3); } #obtn .homeNewsList li .newsWord .tImg{float: left; width: 100%; line-height: 0; overflow: hidden; border-radius: 4px 4px 0 0; -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; } #obtn .homeNewsList li .newsWord .tImg img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeNewsList li .newsWord:hover .tImg img{ transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1); } #obtn .homeNewsList li .newsWord .dText{float: left; width: 100%; border:1px solid #e6e9f0; border-top:0; background: #fff; padding: 23px 30px 21px 30px; border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; } #obtn .homeNewsList li .newsWord .newLi1{float: left; width: 100%; padding-bottom: 18px; border-bottom: 1px solid #e6e9f0;} #obtn .homeNewsList li .newsWord .newLi1 a{float: left; width: 100%; color:#444444; font-size: 14px; line-height: 36px; height: 72px; overflow : hidden; /**text-overflow: ellipsis;***/ display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #obtn .homeNewsList li .newsWord .newLi1 a:hover{color:#00bab4} #obtn .homeNewsList li .newsWord .newLi1 a img{vertical-align: middle; margin-top: -5px;} #obtn .homeNewsList li .newsWord dl{float: left; width: 100%; margin-top: 19px;} #obtn .homeNewsList li .newsWord dd{float: left; width: 100%;} #obtn .homeNewsList li .newsWord dd a{float: left; width: 100%; padding:0 50px 0 43px; line-height: 40px;color:#444444; font-size: 14px; position: relative; } #obtn .homeNewsList li .newsWord dd a:hover{color:#00bab4} #obtn .homeNewsList li .newsWord dd a span{float: left; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #obtn .homeNewsList li .newsWord dd a i{position: absolute;left: 0;width: 30px;height: 20px;background: #00bab4;text-align: center;line-height:20px;color:#fff;font-size: 12px;top:50%;margin-top: -10px;} #obtn .homeNewsList li .newsWord dd a em{position: absolute; right: 0; color:#888888; font-size: 14px; line-height: 40px; text-decoration: underline; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .homeNewsList li .newsWord dd a:hover em{color:#00bab4;} #obtn .homeNewsList li .newsWord dd.two a{padding-left: 0;} #obtn .newMore{float: left; width: 100%; margin-top: 60px; display: block; text-align: center;} #obtn .newMore a{ display: inline-block; width: 180px; height: 50px; text-align: center; font-size: 16px; line-height: 50px; color:#fff; background-color: #00bbae; background-image: linear-gradient(to bottom right, #00d3ae , #00bab4); position: relative; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .newMore a:before { content: '';position: absolute;top: -20px;left: -20px;bottom: -20px;right: -20px;background: inherit;border-radius: 50px;z-index: -1;opacity: 0.4; -webkit-transform: scale3d(0.8, 0.5, 1); -moz-transform: scale3d(0.8, 0.5, 1); -o-transform: scale3d(0.8, 0.5, 1); transform: scale3d(0.8, 0.5, 1); } #obtn .newMore a:hover { -webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s; transition: background-color 0.1s 0.3s, color 0.1s 0.3s; color: #fff; background-color: #58d498; -webkit-animation: anim-moema-1 0.3s forwards; -moz-animation: anim-moema-1 0.3s forwards; -o-animation: anim-moema-1 0.3s forwards; animation: anim-moema-1 0.3s forwards; } #obtn .newMore a:hover:before { -webkit-animation: anim-moema-2 0.3s 0.3s forwards; -moz-animation: anim-moema-2 0.3s 0.3s forwards; -o-animation: anim-moema-2 0.3s 0.3s forwards; animation: anim-moema-2 0.3s 0.3s forwards; } @media screen and (max-width:1399px) { #obtn .homeNewsInfo{ margin: 70px 0 65px 0} #obtn .homeNewsList{margin-top: 30px;} #obtn .homeNewsList ul{margin: 0 -15px;} #obtn .homeNewsList li{padding: 0 15px;} #obtn .newMore{margin-top: 45px;} } @media screen and (max-width:1229px) { #obtn .homeNewsInfo{ margin: 60px 0;} #obtn .homeNewsList{margin-top: 20px;} #obtn .homeNewsList li .newsWord .dText{padding: 15px 20px 15px 20px;} #obtn .homeNewsList li .newsWord .newLi1 a{font-size: 16px; line-height: 30px; height: 60px;} #obtn .homeNewsList li .newsWord .newLi1 a img{width: 25px; height: 25px;} #obtn .homeNewsList li .newsWord dl{margin-top: 15px;} #obtn .homeNewsList li .newsWord dd a{font-size: 15px; line-height: 35px;} #obtn .homeNewsList li .newsWord dd a em{line-height: 35px;} #obtn .newMore{margin-top: 40px;} } @media screen and (max-width:1023px) { #obtn .homeNewsInfo{ margin:50px 0;} #obtn .homeNewsList{margin-top: 10px;} #obtn .homeNewsList ul{margin: 0 -10px;} #obtn .homeNewsList li{padding: 0 10px;} #obtn .homeNewsList li .newsWord .newLi1{padding-bottom: 10px;} #obtn .homeNewsList li .newsWord .newLi1 a{font-size: 15px; line-height: 28px; height: 56px;} #obtn .newMore{margin-top:30px;} } @media screen and (max-width:767px) { #obtn .homeNewsInfo{ margin:30px 0 35px 0;} #obtn .homeNewsList{margin-top: 5px;} #obtn .homeNewsList li{width: 100%; margin-top: 15px;} #obtn .newMore{margin-top: 25px;} #obtn .newMore a{width: 140px; height: 40px; line-height: 40px; font-size: 15px;} } /*底部*/ #obtn .BottomConBox{float: left;width: 100%;/* background: #0945bc; */position: relative;} #obtn .BottomConBox.parkBack1{ background:#31cdb0; background: -webkit-linear-gradient(top,#31cdb0,#3551a4); background: -o-linear-gradient(top,#31cdb0,#3551a4); background: -moz-linear-gradient(top,#31cdb0,#3551a4); background: -ms-linear-gradient(top,#31cdb0,#3551a4); background: linear-gradient(to bottom,#31cdb0,#3551a4); background: -webkit-gradient(linear, top bottom,top right, color-stop(0%,#31cdb0), color-stop(100%,#3551a4)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .BottomConBg{position: absolute;left: 0;top:0;width: 100%;height: 100%;/* opacity: 0.3; */filter:alpha(opacity=30);} #obtn .BottomConBox.parkBack1 .BottomConBg{opacity: 0.2;filter:alpha(opacity=20);} #obtn .BottomConInfo{float: left; width: 100%; margin: 67px 0 70px 0; position: relative; z-index: 3;} #obtn .BottomConInfo .p4{float: left; width: 100%; text-align: center; color:#fff; font-size: 28px; line-height: 50px;} #obtn .BottomConInfo .more{float: left; width: 100%; display: block; text-align: center; margin-top: 43px;} #obtn .BottomConInfo .more a{display: inline-block; width: 180px; height: 50px; margin:0 10px;border:2px solid #fff; border:2px solid rgba(255,255,255,0.6); text-align: center; line-height: 46px; color:#fff; font-size: 16px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .BottomConInfo .more a:hover{background: #fff; background: rgba(255,255,255,0.95); color:#00bab4} @media screen and (max-width:1229px) { #obtn .BottomConInfo{ margin: 55px 0;} #obtn .BottomConInfo .p4{font-size: 30px;} #obtn .BottomConInfo .more{margin-top: 35px;} } @media screen and (max-width:1023px) { #obtn .BottomConInfo{ margin: 40px 0;} #obtn .BottomConInfo .more{margin-top: 25px;} #obtn .BottomConInfo .more a{height: 45px; line-height: 41px;} } @media screen and (max-width:767px) { #obtn .BottomConInfo{ margin: 30px 0;} #obtn .BottomConInfo .p4{font-size: 24px;} #obtn .BottomConInfo .more{margin-top: 15px;} #obtn .BottomConInfo .more a{font-size: 16px; width: 140px; height: 40px; line-height: 36px;} } #obtn .pz_down{float: left; width: 100%; background: #252d45;} #obtn .footerBox{float: left; width: 100%; margin: 90px 0 105px 0; position: relative} #obtn .footerBox .links{position: absolute; left: 0; bottom: -52px;} #obtn .footerBox .links h5{ float:left; width: 150px; height: 44px; color:#fff; color:rgba(255,255,255,0.4); font-size:14px; cursor:pointer;border:1px solid #fff;border:1px solid rgba(255,255,255,0.1); text-align:center; line-height: 42px; } #obtn .footerBox .links h5 img{vertical-align: middle; margin-top: -2px;} #obtn .footerBox .links ul{ display:none; float:left; width:150px; text-align:center; position:absolute; right:0; bottom:44px; background:#111; background:rgba(17,17,17,0.5); padding:6px 0;} #obtn .footerBox .links ul li{ float:left; width:100%;} #obtn .footerBox .links ul li a{ float:left; width:100%; color:#fff; font-size:12px; line-height:20px;} #obtn .footerBox .links ul li a:hover{ color:#58d498;} #obtn .footLogo{float: left; width: 16.3%;} #obtn .footLogo .tImg{float: left; width:100%; line-height: 0; padding: 9px 0 15px 0; border-bottom: 1px solid #fff; border-bottom: 1px solid rgba(255,255,255,0.1); } #obtn .footNav{float: left; width: 66.66%;} #obtn .footNav .ul1{float: left; width: 14.28%;} #obtn .footNav .ul1 .footTit{float: left; width: 100%; line-height: 50px; font-size: 16px; padding-bottom: 7px; border-bottom: 1px solid #fff; border-bottom: 1px solid rgba(255,255,255,0.1); color:#fff;} #obtn .footNav .ul1 .footTit a{color:#fff;} #obtn .footNav .ul1 .footTit a:hover{color:#58d498;} #obtn .footNav .ul1 .box{float: left; width: 100%; margin-top: 8px;} #obtn .footNav .ul1 .box li{float: left; width: 100%; line-height: 32px;} #obtn .footNav .ul1 .box li a{font-size: 14px; color:#fff; color:rgba(255,255,255,0.4);} #obtn .footNav .ul1 .box li a:hover{color:#58d498} #obtn .footUs{float: left; width: 17.04%;} #obtn .footUs .footTit{float: left; width: 100%; line-height: 50px;font-size: 16px; padding-bottom: 7px; border-bottom: 1px solid #fff; border-bottom: 1px solid rgba(255,255,255,0.1); color:#fff;} #obtn .footUs .footTel{float: left; width: 100%; margin-top: 8px;line-height: 48px; color:#fff; font-size: 24px; font-weight: bold;} #obtn .footUs .footAdd{float: left; width: 100%;} #obtn .footUs .footAdd>div{ justify-content:space-between;} #obtn .footUs .footAdd img{width: 49%;display: block;margin-top: 8px;margin-bottom: 8px;} #obtn .footUs .footAdd dd{float: left; width: 100%; margin-top: 10px; color:#fff; color:rgba(255,255,255,0.4); line-height: 20px; min-height: 40px; font-size: 14px;} #obtn .footUs .footIco{float: left; width: 100%; margin-top: 10px;} #obtn .footUs .footIco span{float: left; width: 34px; height: 34px; margin-right:8px; background: #fff; background: rgba(255,255,255,0.1); cursor: pointer;position: relative; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } #obtn .footUs .footIco span i{position: absolute; width: 34px; height: 34px; line-height: 0; left: 0; top:0; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .footUs .footIco span i.last{opacity: 0;filter:alpha(opacity=0);} #obtn .footUs .footIco span:hover i.first{opacity: 0;filter:alpha(opacity=0);} #obtn .footUs .footIco span:hover i.last{opacity: 1;filter:alpha(opacity=100);} #obtn .footUs .footIco span .ewm{position: absolute; display: none; left: 0; top:63px; line-height: 0; padding:5px; background: #fff; width: 100px; height: 100px;} #obtn .footUs .footIco span:hover .ewm{display: block;} #obtn .footUs .footIco span .ewmq{position: absolute; display: none; left: 0; top:63px; line-height: 0; padding:5px; background: #fff; width: 150px; height: 150px;} #obtn .footUs .footIco span:hover .ewmq{display: block;} @media screen and (max-width:1399px) { #obtn .footerBox{margin: 70px 0 100px 0;} } @media screen and (max-width:1229px) { #obtn .footerBox{margin: 55px 0 80px 0;} #obtn .footNav{width: 62.66%;} #obtn .footUs{width: 21.04%;} } @media screen and (max-width:1023px) { #obtn .footerBox{margin:40px 0 80px 0;} #obtn .footNav{display: none;} #obtn .footLogo{width: 40%;} #obtn .footUs{width:60%;} } @media screen and (max-width:767px) { #obtn .pz_down{margin-bottom: 50px;} #obtn .footerBox{margin:30px 0 35px 0;} #obtn .footLogo{width: 100%;} #obtn .footLogo .tImg{border-bottom: 0;padding:0;} #obtn .footUs{width: 100%;} #obtn .footUs .footTel{font-size: 20px; line-height: 35px;} #obtn .footUs .footAdd dd{min-height:auto;} #obtn .footUs .footIco{margin-top: 15px;} #obtn .footerBox .links{position: relative; float: left; margin-top: 25px; bottom: 0;} } #obtn .footerCopyright{float: left; width: 100%; text-align: center; border-top:1px solid #fff; border-top:1px solid rgba(255,255,255,0.1); padding: 40px 0 46px 0; color:#fff; color:rgba(255,255,255,0.4); line-height: 30px; font-size: 14px;} #obtn .footerCopyright a{color:#fff; color:rgba(255,255,255,0.4);} #obtn .footerCopyright a:hover{color:#58d498} @media screen and (max-width:1399px) { #obtn .footerCopyright{padding: 30px 0 35px 0;} } @media screen and (max-width:767px) { #obtn .footerCopyright{padding:20px 0;} } /*漂浮*/ #obtn .right_pf{ float:left; position:fixed; right:25px; top:50%; margin-top:-10px; width:54px; z-index:101; text-align:center; box-shadow: 0 0 18px rgba(162,162,162,0.3); -moz-box-shadow: 0 0 18px rgba(162,162,162,0.3); -webkit-box-shadow: 0 0 18px rgba(162,162,162,0.3); } #obtn .right_pf .ul4{float: left; width: 100%;} #obtn .right_pf .ul4 li{float: left; width: 100%;} #obtn .right_pf .ul4 li a{float: left; width: 100%; line-height: 0; background:#0fe9b2; background: -webkit-linear-gradient(left,#33c08a,#5cd499); background: -o-linear-gradient(left,#33c08a,#5cd499); background: -moz-linear-gradient(left,#33c08a,#5cd499); background: -ms-linear-gradient(left,#33c08a,#5cd499); background: linear-gradient(to right,#33c08a,#5cd499); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#33c08a), color-stop(100%,#5cd499)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .right_pf .ul4 li a:hover{ background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .right_pf .ul4 li{height: 56px; margin-top: 1px; } #obtn .right_pf .ul4 li a{height: 100%;font-size: 14px; line-height: 16px; padding: 8px 0;position: relative;border-radius: 3px;} #obtn .right_pf .ul4 li a p{color:#FFF;font-size: 12px;} #obtn .right_pf .ul4 li a .om{width: 0px;height: 56px;font-size: 18px;line-height: 60px;color: #fff;text-align: center; white-space: nowrap;overflow: hidden; background: url(../2020/_im_g/om.png) no-repeat right;background-size: 5px; position: absolute;top: 0;right: 46px;transition: 0.3s;z-index:-1;} #obtn .right_pf .ul4 li a .om span{display: block;margin-right: 5px;border-radius: 2px; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .right_pf .ul4 li.weixin a .om{right: 55px; top:-100%;border-radius: 3px;} #obtn .right_pf .ul4 li.weixin a .om span{padding-top:20px;padding-left: 20px; font-size:14px; box-sizing:border-box;} #obtn .right_pf .ul4 li.weixin a .om span img{display:block;} #obtn .right_pf .ul4 li.weixin a .om span b{ display:block; margin-top:-15px;padding-right: 12%;} #obtn .right_pf .ul4 li.weixin a:hover .om{width: 189px !important;height:200px !important;} #obtn .right_pf .ul4 li a:hover .om{width: 180px;} #obtn .right_pf .ul4 li.renter a{ padding:8px 0; /**margin-top:1px;**/} /*客户案例*/ #obtn .iBanner{float: left; width: 100%; margin-top: 75px; background: #001149; position: relative;} #obtn .iBanner a.zx{width: 160px;line-height: 46px;color: #fff;border-radius: 5px; text-align: center;transition: 0.3s; border: 1px solid #fff;background: #fff;background: rgba(255,255,255,0.2); position: absolute;bottom: 15%;left: 50%;margin-left: -80px;} #obtn .iBanner a.zx:hover{border: 1px solid #58d498;background: #58d498;} #obtn .iBanner .box{float: left; width: 100%; line-height: 0;/* opacity: 0.7;filter:alpha(opacity=70);*/} #obtn .iBanner .pageBanText{position: absolute; width: 100%; left: 0; top:50%; margin-top: -30px; color:#fff; font-weight: 600; font-size: 40px; line-height: 60px; text-align: center;} @media screen and (max-width:1399px) { #obtn .iBanner .pageBanText{font-size:50px;} } @media screen and (max-width:1229px) { #obtn .iBanner .pageBanText{font-size: 46px;} #obtn .iBanner a.zx{width: 140px;line-height: 34px;bottom: 13%;margin-left: -70px;} } @media screen and (max-width:1023px) { #obtn .iBanner{margin-top: 63px;} #obtn .iBanner .pageBanText{font-size: 36px;} } @media screen and (max-width:767px) { #obtn .iBanner .pageBanText{font-size: 28px;} #obtn .iBanner a.zx{display: none;} } /*案例二级导航*/ #obtn .slideBox{float: left; width: 100%; position: static; background: #fff;} #obtn .pz_SideLayer{float: left; width: 100%;} #obtn .pz_SideLayer .l1{float: left; width:16.666%; text-align: center;} #obtn .pz_SideLayer .l1 a{float: left; width: 100%; color:#444444; font-size: 16px; line-height: 70px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .pz_SideLayer .l1.on a{font-weight: bold; color:#fff; background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .slideBox.on{position: fixed; top:0; left: 0; z-index: 55;} #obtn .slideBox.on .pz_SideLayer .l1 a{ font-size: 15px; line-height:50px;} @media screen and (max-width:1023px) { #obtn .pz_SideLayer .l1 a{font-size: 15px; line-height: 60px;} } @media screen and (max-width:767px) { #obtn .slideBox .container2{padding: 0;} #obtn .pz_SideLayer .l1{width: 25%; border:1px solid #f5f5f5; border-top:0;} #obtn .pz_SideLayer .l1 a{font-size: 14px; line-height:36px;} #obtn .pz_SideLayer{ white-space:nowrap; overflow:auto;} #obtn .pz_SideLayer .l1{ float:none; white-space:nowrap; display:inline-block; vertical-align:top;} #obtn .slideBox.on .pz_SideLayer .l1 a{ font-size: 14px; line-height:36px;} } #obtn .greyBg{float: left; width: 100%; background: #f5f7fb;} #obtn .pageWisdomBox{float: left; width: 100%; margin: 54px 0 94px 0;} #obtn .pageTit{float: left; width: 100%; text-align: center; color:#444444; font-size: 26px; line-height: 60px;} #obtn .txtc{text-align: center;} #obtn .logoListBox{float: left; width: 100%; margin-top: 37px;} #obtn .logoListBox ul{margin: 0 -10px;} #obtn .logoListBox li{float: left; width: 20%; padding: 0 10px; margin-top: 19px;} #obtn .logoListBox li .ico{float: left; width: 100%; line-height: 0; border:1px solid #e5e5e5; border-radius:4px; overflow: hidden; position: relative; -moz-border-radius:4px; -webkit-border-radius:4px; } #obtn .logoListBox li .ico .textBox{position: absolute; left: 0; top:0; width: 100%; height:100%; display: table;} #obtn .logoListBox li .ico .textBox span{display: table-cell; vertical-align: middle; text-align: center; font-size: 16px; line-height: 24px; padding: 0 10px; height: 110px; background:#0fe9b2; background: -webkit-linear-gradient(left,#17e8be,#04c0f0); background: -o-linear-gradient(left,#17e8be,#04c0f0); background: -moz-linear-gradient(left,#17e8be,#04c0f0); background: -ms-linear-gradient(left,#17e8be,#04c0f0); background: linear-gradient(to right,#17e8be,#04c0f0); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#17e8be), color-stop(100%,#04c0f0)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#17e8be', endColorstr='#04c0f0',GradientType=0); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } #obtn .logoListBox li .writtenBox{position: absolute; left: 0; top:0; width: 100%; height: 100%; color:#fff; font-size: 16px; line-height: 28px; opacity: 0;filter:alpha(opacity=0); background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; display:flex;flex-direction: column;justify-content:center;align-items:center; } #obtn .logoListBox li .writtenBox .table{float: left; width: 100%; height: 100%; display: table;} #obtn .logoListBox li .writtenBox .tableCell{display: table-cell; vertical-align: middle; text-align: center;} #obtn .logoListBox li .ico:hover .writtenBox{ opacity: 1;filter:alpha(opacity=100); transform:rotateY(360deg); -ms-transform:rotateY(360deg); -moz-transform:rotateY(360deg); -webkit-transform:rotateY(360deg); -o-transform:rotateY(360deg); } @media screen and (max-width:1229px) { #obtn .pageWisdomBox{ margin:75px 0 80px 0;} #obtn .pageTit{font-size: 32px; line-height: 50px;} #obtn .logoListBox{margin-top: 30px;} } @media screen and (max-width:1023px) { #obtn .pageWisdomBox{margin: 55px 0 60px 0;} #obtn .pageTit{font-size: 28px; line-height: 45px;} #obtn .logoListBox{margin-top: 15px;} #obtn .logoListBox li{width: 25%;} #obtn .logoListBox li .writtenBox{line-height: 24px;} #obtn .logoListBox li .ico .textBox span{font-size: 16px;} } @media screen and (max-width:767px) { #obtn .pageWisdomBox{margin: 35px 0 40px 0;} #obtn .pageTit{font-size: 20px; line-height: 40px;} #obtn .logoListBox{margin-top: 10px;} #obtn .logoListBox ul{margin: 0 -5px;} #obtn .logoListBox li{padding: 0 5px; margin-top: 10px; width: 33.3333%;} #obtn .logoListBox li .writtenBox{font-size: 12px; line-height: 20px;} #obtn .logoListBox li .ico .textBox span{font-size: 12px; line-height: 20px;height: 60px;padding: 10px 0;} } /*新城控股--智慧工地*/ #obtn .pageCaseBox{float: left; width: 100%; padding: 0 60px; margin-bottom: 120px;} #obtn .currentLocation{float: left; width: 100%; font-size: 16px; color:#666666; line-height: 45px; padding: 27px 0 24px 0; border-bottom: 1px solid #e6e6e6; } #obtn .currentLocation a{color:#666666;} #obtn .currentLocation a.on:hover, #obtn .currentLocation a:hover{color:#58d498} #obtn .currentLocation a.on{color:#c9c9c9} #obtn .pageCaseBox h1{float: left; width: 100%; margin-top:59px; font-size: 36px; line-height: 60px;font-weight: bold;} #obtn .pageCaseBox h2{float: left; width: 100%; margin-top: 13px; color:#444; font-size: 24px; line-height: 45px;} #obtn .pageCaseBox .secondLevel{float: left; width: 100%; margin-top: 60px;} #obtn .pageCaseBox .secondLevel li{float: left; margin-right: 30px;} #obtn .pageCaseBox .secondLevel li a{float: left; min-width: 200px; padding: 0 20px; background: #f2f4f7; color:#444; font-size: 18px; line-height: 48px; text-align: center;} #obtn .pageCaseBox .secondLevel li a.on, #obtn .pageCaseBox .secondLevel li a:hover{color:#fff; background: #58d398;} #obtn .pageCaseBox .p1{float: left; width: 100%; margin-top: 20px; color:#777777; font-size: 16px; line-height: 30px;} #obtn .pageCaseBox .dl{float: left; width: 100%; margin: 55px 0 20px 0;} #obtn .pageCaseBox .dl h3{float: left; width: 100%; color:#444444; font-size: 22px; line-height: 40px; padding-left: 20px; position: relative} #obtn .pageCaseBox .dl h3:after{position: absolute; content: ''; width: 5px; height: 25px; background: #4bcc93; left: 0; top:50%; margin-top: -12.5px;} #obtn .pageCaseBox .dl .p2{float: left; width: 100%; margin-top: 14px; color:#777777; font-size: 16px; line-height: 30px;} #obtn .pageCaseBox .dl .imgBox{float: left; width: 100%; line-height: 0; margin-top: 30px;} #obtn .pageCaseBox .p1 h3{float: left;min-width: 200px;padding: 0 20px;font-size: 18px;line-height: 48px;text-align: center;background: #58d398;color: #fff;margin: 30px 10px;} #obtn .pageCaseBox .p1 h3:hover{background: #56ca92;color: #fff;} #obtn .pageCaseBox .p1 h3 a{color: #fff;} #obtn .pageCaseBox .p1 h4{float: left;min-width: 200px;padding: 0 20px;background: #f2f4f7;color: #444;font-size: 18px;line-height: 48px;text-align: center;margin: 30px 10px;} #obtn .pageCaseBox .p1 h4:hover{color: #fff;background: #56ca92;} #obtn .pageCaseBox .p1 h4 a:hover{color: #fff;background: #56ca92;} #obtn .pageCaseBox .p1 h5{float: left;min-width: 200px;padding: 0 10px;font-size: 16px;line-height: 48px;text-align: center;background: #4d7dc7;color: #fff;margin: 30px 10px;} #obtn .pageCaseBox .p1 p strong{float: left;width: 100%;color: #444444;font-size: 22px;line-height: 30px;padding-left:15px;position: relative;font-weight: 400;border-left: 5px solid #4bcc93; margin-top: 60px; margin-bottom: 20px;} #obtn .pageCaseBox .p1 p{float: left; width: 100%; /**margin-top: 20px; **/color:#777777; font-size: 16px; line-height: 30px;} #obtn .pageCaseBox .p1 p img{padding-top: 15px;height: auto !important;} @media screen and (max-width:1229px) { #obtn .pageCaseBox{padding: 0 30px; margin-bottom: 90px;} #obtn .currentLocation{padding: 15px 0;} #obtn .pageCaseBox h1{font-size: 30px;line-height: 50px; margin-top:40px;} #obtn .pageCaseBox h2{font-size: 24px; line-height:40px; margin-top: 5px;} #obtn .pageCaseBox .secondLevel{margin-top: 45px;} #obtn .pageCaseBox .secondLevel li{margin-right: 20px;} #obtn .pageCaseBox .secondLevel li a{font-size: 16px; line-height: 45px;} #obtn .pageCaseBox .p1{margin-top: 70px;} #obtn .pageCaseBox .dl{margin: 40px 0 20px 0;} #obtn .pageCaseBox .dl h3{font-size: 20px; padding-left: 15px;} #obtn .pageCaseBox .dl h3:after{width: 3px; height: 20px; margin-top: -10px;} } @media screen and (max-width:1023px) { #obtn .pageCaseBox{padding:0; margin-bottom: 50px;} #obtn .currentLocation{font-size: 15px; line-height: 35px;} #obtn .pageCaseBox h1{font-size: 28px; margin-top: 30px;} #obtn .pageCaseBox h2{font-size: 20px; line-height: 35px;} #obtn .pageCaseBox .secondLevel{margin-top: 30px;} #obtn .pageCaseBox .p1{margin-top: 50px; font-size: 15px; line-height: 26px;} #obtn .pageCaseBox .dl{margin: 30px 0 15px 0;} #obtn .pageCaseBox .dl .p2{font-size: 15px; line-height: 26px;} #obtn .pageCaseBox .dl .imgBox{margin-top: 25px;} } @media screen and (max-width:767px) { #obtn .pageCaseBox{margin-bottom: 30px;} #obtn .currentLocation{padding: 10px 0; font-size: 14px;} #obtn .pageCaseBox h1{font-size: 24px; margin-top: 15px;} #obtn .pageCaseBox h2{font-size: 18px; margin-top: 0;} #obtn .pageCaseBox .secondLevel{margin-top: 10px;} #obtn .pageCaseBox .secondLevel li{margin: 10px 10px 0 0;} #obtn .pageCaseBox .secondLevel li a{min-width: 100px; padding:0 10px; font-size: 14px; line-height: 40px;} #obtn .pageCaseBox .p1{margin-top: 30px; font-size: 14px; line-height: 24px;} #obtn .pageCaseBox .dl{margin: 25px 0 0 0;} #obtn .pageCaseBox .dl h3{font-size: 18px; line-height: 35px;} #obtn .pageCaseBox .dl .p2{margin-top: 10px; font-size: 14px; line-height: 24px;} #obtn .pageCaseBox .dl .imgBox{margin-top: 15px;} } /*智慧商业*/ #obtn .iBanner .pageBanSol{position: absolute; width: 1200px; left: 50%; margin-left: -600px; top:36%; margin-top: -75px;} #obtn .iBanner .pageBanSol h3{float: left; width: 100%; color:#fff; font-size: 36px; line-height: 80px;font-weight: 600;} #obtn .iBanner .pageBanSol h5{color: #fff; font-size: 22px; line-height: 50px;} #obtn .iBanner .pageBanSol .p5{float: left; width: 50%; color:#fff; font-size: 15px; line-height: 24px; margin-top: 5px; text-align:justify;} @media screen and (max-width:1229px) { #obtn .iBanner .pageBanSol{width: 994px;margin-left: -497px;} #obtn .iBanner .pageBanSol h3{font-size: 26px; line-height: 40px;} #obtn .iBanner .pageBanSol h5{color: #fff; font-size: 18px; line-height: 30px;} #obtn .iBanner .pageBanSol .p5{font-size: 15px; margin-top: 10px;} } @media screen and (max-width:1023px) { #obtn .iBanner .pageBanSol{width: 738px;margin-left: -369px; margin-top: -69px;} #obtn .iBanner .pageBanSol h3{font-size: 24px; line-height: 40px;} #obtn .iBanner .pageBanSol h5{color: #fff; font-size: 14px;padding-top: 30px; } #obtn .iBanner .pageBanSol .p5{font-size: 13px; line-height: 22px; width: 100%;} } @media screen and (max-width:767px) { #obtn .iBanner .pageBanSol{width:100%;left: 0; margin-left:0; padding: 0 15px; margin-top: -50px;} #obtn .iBanner .pageBanSol h3{font-size: 22px; line-height: 20px;} #obtn .iBanner .pageBanSol .p5{line-height: 15px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; overflow: hidden; } } /*1-智慧商业*/ #obtn .solSecBox{float: left; width: 100%; border-bottom: 1px solid #e5e5e5; background: #fff;} #obtn .solSecBox.on{position: fixed; left: 0; top:0; z-index: 55;} #obtn .solSecondLevel{float: left; width: 100%; padding: 27px 0 28px 0;} #obtn .solSecondLevel li{float: left; width: 25%; text-align: center; display: block;} #obtn .solSecondLevel li a{display: inline-block;} #obtn .solSecondLevel li a .tIco{display: block; width: 100%; height: 60px; position: relative; } #obtn .solSecondLevel li a .tIco i{position:absolute; line-height: 0; width: 60px; height: 60px; left:50%; margin-left: -30px; top:0; border:2px solid #3e7cf7; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; } #obtn .solSecondLevel li a .tIco i:last-child{ opacity: 0;filter:alpha(opacity=0); border:0; background:#2735f7; background: -webkit-linear-gradient(left,#18aff5,#2735f7); background: -o-linear-gradient(left,#18aff5,#2735f7); background: -moz-linear-gradient(left,#18aff5,#2735f7); background: -ms-linear-gradient(left,#18aff5,#2735f7); background: linear-gradient(to right,#18aff5,#2735f7); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#18aff5), color-stop(100%,#2735f7)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#18aff5', endColorstr='#2735f7',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solSecondLevel li a .dText{display: block; text-align: center; color:#000000; font-size: 15px; line-height: 30px; margin-top: 10px;} #obtn .solSecondLevel li.on a .tIco i:nth-child(1){ opacity:1;filter:alpha(opacity=100);} #obtn .solSecondLevel li.on a .tIco i:last-child{ opacity:1;filter:alpha(opacity=100);} #obtn .solSecBox.on .solSecondLevel{ padding:10px 0;} #obtn .solSecBox.on .solSecondLevel li a .tIco{ height:50px;} #obtn .solSecBox.on .solSecondLevel li a .tIco i{ width:50px; height:50px;} #obtn .solSecBox.on .solSecondLevel li a .dText { margin-top:5px; line-height:24px; font-size:14px;} #obtn .greyBg1{float: left; width: 100%; background: #f7f7f7;} #obtn .solVisualized{float: left; width: 100%; margin: 53px 0 115px 0;} #obtn .solVisualized .p6{float: left; width: 100%; text-align: center; color:#444444; font-size: 15px; line-height: 24px; margin-top: 12px;} #obtn .solVisualList{float: left; width: 100%; margin: 20px 0 0 0;} #obtn .solVisualList .slick-list{padding: 20px 0;} #obtn .solVisualList .li1{float: left; width: 100%; background: #fff; box-shadow: 0 3px 27px rgba(183,183,184,0.3); -moz-box-shadow: 0 3px 27px rgba(183,183,184,0.3); -webkit-box-shadow: 0 3px 27px rgba(183,183,184,0.3); } #obtn .solVisualList .li1 .lImg{float: left; width:35%; line-height: 0; position: relative} #obtn .solVisualList .li1 .textInfo{position: absolute; width: 430px; height: 300px; left: 50px; top:58px; padding: 60px 25px 0 25px;} #obtn .solVisualList .li1 .textInfo:after{position: absolute; content: ''; width: 100%; height: 100%; opacity: 0.85;filter:alpha(opacity=85); left: 0; top:0; background:#2735f7; background: -webkit-linear-gradient(left,#18aff5,#2735f7); background: -o-linear-gradient(left,#18aff5,#2735f7); background: -moz-linear-gradient(left,#18aff5,#2735f7); background: -ms-linear-gradient(left,#18aff5,#2735f7); background: linear-gradient(to right,#18aff5,#2735f7); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#18aff5), color-stop(100%,#2735f7)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#18aff5', endColorstr='#2735f7',GradientType=0); } #obtn .solVisualList .li1 .textInfo h2{float: left; width: 100%; color:#fff; font-size: 20px; line-height: 40px; position: relative; z-index: 2;} #obtn .solVisualList .li1 .textInfo .p7{float: left; width: 100%; color:#fff; font-size:14px; line-height: 24px; margin-top: 18px; position: relative; z-index: 2; text-align:justify;} #obtn .solVisualList .li1 .rightBox{float: right; width: 57%;} #obtn .solVisualList .li1 .rightBox dl{float: left; width: 100%; margin-top: 60px;} #obtn .solVisualList .li1 .rightBox dl dd{float: left; width:50%; padding:0 30px 0 65px; margin-top:50px; position: relative; /**cursor: pointer;***/} #obtn .solVisualList .li1 .rightBox dl dd .ico{position: absolute; left: 0; top:0;} #obtn .solVisualList .li1 .rightBox dl dd .ico img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solVisualList .li1 .rightBox dl dd:hover .ico img{ transform:rotateY(360deg); -ms-transform:rotateY(360deg); -moz-transform:rotateY(360deg); -webkit-transform:rotateY(360deg); -o-transform:rotateY(360deg); } #obtn .solVisualList .li1 .rightBox dl dd h3{float: left; width: 100%; color:#444444; font-size: 16px; line-height: 35px;} #obtn .solVisualList .li1 .rightBox dl dd .p1{float: left; width: 100%; min-height: 48px; color:#777777; font-size: 14px; line-height: 24px; margin-top: 5px;} #obtn .solVisualList .li1 .rightBox.three{width: 60%;} #obtn .solVisualList .li1 .rightBox.three dl dd{width: 33.3333%; padding-right: 20px; margin-top: 60px;} #obtn .solVisualList .li1 .rightBox.three dl dd .ico{top:50%; margin-top: -30px;} #obtn .solVisualList .slick-dots{height: 6px;} #obtn .solVisualList .slick-dots li{width: 32px; height: 6px; margin: 0 10px; background: #c1c1c1;} #obtn .solVisualList .slick-dots li.slick-active{background: #2c78d6;} @media screen and (max-width:1229px) { #obtn .solSecondLevel{padding: 20px 0;} #obtn .solVisualized{margin: 45px 0 90px 0;} #obtn .solVisualList .slick-dots{bottom: -15px;} #obtn .solVisualList .li1 .textInfo{width: 380px;padding:40px 20px 0 20px; left: 40px;top: 45px;} #obtn .solVisualList .li1 .textInfo h2{font-size: 24px;} #obtn .solVisualList .li1 .textInfo .p7{font-size: 15px; margin-top: 15px;} #obtn .solVisualList .li1 .rightBox dl{margin-top: 80px;} #obtn .solVisualList .li1 .rightBox dl dd{margin-top:25px;} #obtn .solVisualList .li1 .rightBox dl dd h3{font-size: 20px;} #obtn .solVisualList .li1 .rightBox dl dd .p1{font-size: 15px;} #obtn .solVisualList .li1 .rightBox.three{width: 57%;} } @media screen and (max-width:1023px) { #obtn .solVisualized{margin: 45px 0 65px 0;} #obtn .solVisualList .li1 .textInfo{width: 100%; height: 100%; left: 0; top:0;padding: 25px 20px 0 20px;} #obtn .solVisualList .li1 .rightBox{width: 65%;} #obtn .solVisualList .li1 .rightBox dl{margin-top: 0;} #obtn .solVisualList .li1 .rightBox dl dd {padding: 0 15px 0 50px; margin-top: 15px;} #obtn .solVisualList .li1 .rightBox dl dd .ico img{width: 45px; height: 45px;} #obtn .solVisualList .li1 .textInfo h2{font-size: 20px;} #obtn .solVisualList .li1 .textInfo .p7{font-size: 14px; margin-top: 10px;} #obtn .solVisualList .li1 .rightBox dl dd .p1{font-size: 14px;} #obtn .solVisualList .li1 .rightBox.three{width: 65%;} #obtn .solVisualList .li1 .rightBox.three dl dd{margin-top: 25px;} #obtn .solVisualList .li1 .rightBox.three dl dd h3{font-size: 18px;} #obtn .solVisualList .slick-dots {bottom: -10px;} } @media screen and (max-width:767px) { #obtn .solSecBox .container2{padding: 0;} #obtn .solSecondLevel{padding: 0;} #obtn .solSecondLevel li{width: 50%; border:1px solid #e5e5e5; padding: 15px 0;} #obtn .solSecondLevel li a .tIco{height: 50px;} #obtn .solSecondLevel li a .tIco i{width: 50px; height: 50px; margin-left: -25px;} #obtn .solSecondLevel li a .dText{font-size: 14px; line-height: 24px;} #obtn .solVisualized{margin: 35px 0 45px 0;} #obtn .solVisualized .p6{font-size: 14px;} #obtn .solVisualList .li1 .lImg{width: 100%;height: 240px; overflow: hidden;} #obtn .solVisualList .li1 .rightBox{width: 100%;} #obtn .solVisualList{margin-top: 5px;} #obtn .solVisualList .li1 .rightBox dl{margin-top: 10px;} #obtn .solVisualList .li1 .rightBox dl dd{width: 100%;padding: 0 15px 0 70px; margin-top: 10px;} #obtn .solVisualList .li1 .rightBox dl dd .ico{left: 15px;} #obtn .solVisualList .li1 .rightBox.three{width: 100%; height: 402px;} #obtn .solVisualList .li1 .rightBox.three dl dd{width:100%;} #obtn .solVisualList .li1 .rightBox.three dl dd .ico{margin-top: -22.5px;} #obtn .solVisualList .slick-dots{bottom: 0;} #obtn .solSecBox.on .solSecondLevel{ padding:0;} #obtn .solSecBox.on .solSecondLevel li{ padding:6px 0;} #obtn .solSecBox.on .solSecondLevel li a .tIco{ height:36px;} #obtn .solSecBox.on .solSecondLevel li a .tIco i{ width:36px; height:36px;} #obtn .solSecBox.on .solSecondLevel li a .dText { margin-top:2px; line-height:22px; font-size:13px;} } #obtn .solAnalysisBox{float: left; width: 100%; background:url("_im_g/sol21.jpg") no-repeat; background-size: cover;} #obtn .solAnalysisInfo{float: left; width: 100%; margin: 48px 0 51px 0;} #obtn .solAnalysisInfo .pageTit{color:#fff;} #obtn .solAnalysisInfo .p1{float: left; width: 100%; text-align: center; color:#fff; font-size: 15px; line-height: 24px; margin-top: 13px;} #obtn .solAnalysisInfo .solAnalysisList{float: left; width: 100%; display: block; text-align: center; margin-top: 10px;} #obtn .solAnalysisInfo .solAnalysisList ul{margin: 0 -45px;} #obtn .solAnalysisInfo .solAnalysisList li{width: 33%; display: inline-block; padding: 0 45px; margin-top: 60px;} #obtn .solAnalysisInfo .solAnalysisList .li2{float: left; width: 100%; background: #fff; background: rgba(255,255,255,0.95); /**cursor: pointer;**/} #obtn .solAnalysisInfo .solAnalysisList .li2 .tIco{float: left; width: 100%; text-align: center; line-height: 0; margin-top:21px;} #obtn .solAnalysisInfo .solAnalysisList .li2 .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solAnalysisInfo .solAnalysisList .li2:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .solAnalysisInfo .solAnalysisList .li2 h3{float: left; width: 100%; text-align: center; color:#444444; font-size: 18px; line-height: 35px; padding-bottom: 12px; position: relative; margin-top: 15px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solAnalysisInfo .solAnalysisList .li2:hover h3{color:#58d498;} #obtn .solAnalysisInfo .solAnalysisList .li2 h3:after{position: absolute; content: ''; width: 30px; height: 2px; left: 50%; margin-left: -15px; bottom: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solAnalysisInfo .solAnalysisList .li2:hover h3:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .solAnalysisInfo .solAnalysisList .li2 .dText{float: left; width: 100%; text-align: center; padding: 0 45px; color:#656565; font-size: 15px; line-height: 30px; margin-top: 18px; margin-bottom: 29px;} @media screen and (max-width:1229px) { #obtn .solAnalysisInfo .solAnalysisList ul{margin: 0 -20px;} #obtn .solAnalysisInfo .solAnalysisList li{padding: 0 20px; margin-top: 40px;} #obtn .solAnalysisInfo .solAnalysisList .li2 h3{font-size: 20px; margin-top: 10px;} #obtn .solAnalysisInfo .solAnalysisList .li2 .dText{font-size: 15px; padding: 0 25px;} } @media screen and (max-width:1023px) { #obtn .solAnalysisInfo .solAnalysisList ul{margin: 0 -10px;} #obtn .solAnalysisInfo .solAnalysisList li{width: 32.5%; padding: 0 10px; margin-top: 20px;} #obtn .solAnalysisInfo .solAnalysisList .li2 .tIco{margin-top: 15px;} #obtn .solAnalysisInfo .solAnalysisList .li2 h3{font-size: 18px; line-height: 30px;} #obtn .solAnalysisInfo .solAnalysisList .li2 .dText{font-size: 14px; line-height: 24px;padding: 0 20px; margin:15px 0 20px 0; height: 72px;} } @media screen and (max-width:767px) { #obtn .solAnalysisInfo{margin:35px 0 40px 0;} #obtn .solAnalysisInfo .p1{font-size: 14px; line-height: 24px;} #obtn .solAnalysisInfo .solAnalysisList li{width: 100%; margin-top: 15px;} #obtn .solAnalysisInfo .solAnalysisList .li2 .dText{height: auto; min-height: 48px;} } #obtn .solMarketBox{float: left; width: 100%; margin: 48px 0 118px 0;} #obtn .solMarketBox .p1{float: left; width: 100%; text-align: center; color:#444444; font-size: 15px; line-height: 24px; margin-top: 13px;} #obtn .solMarketList{float: left; width: 100%; margin-top: 33px;} #obtn .solMarketList ul{margin: 0 -28px;} #obtn .solMarketList li{float: left; width: 25%; margin-top: 30px; padding: 0 28px;} #obtn .solMarketList .li3{float: left; width: 100%; background: #fff; box-shadow: 0 0 13px rgba(120,131,144,0.3); -moz-box-shadow: 0 0 13px rgba(120,131,144,0.3); -webkit-box-shadow: 0 0 13px rgba(120,131,144,0.3); } #obtn .solMarketList .li3 .tIco{float: left; width: 100%; line-height: 0; margin-top: 39px; text-align: center;} #obtn .solMarketList .li3 .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solMarketList .li3:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .solMarketList .li3 h3{float: left; width: 100%; text-align: center; color:#444444; font-size:18px; line-height: 35px; padding-bottom: 12px; position: relative; margin-top: 15px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solMarketList .li3:hover h3{color:#58d498;} #obtn .solMarketList .li3 h3:after{position: absolute; content: ''; width: 30px; height: 2px; left: 50%; margin-left: -15px; bottom: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solMarketList .li3:hover h3:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .solMarketList .li3 .dText{float: left; width: 100%; text-align: center; color:#656565; font-size: 15px; line-height: 30px; margin-top: 18px; margin-bottom: 45px;} #obtn .solMarketList .li3 .dImg{float: left; width: 100%; line-height: 0; background: #000; overflow: hidden;} #obtn .solMarketList .li3 .dImg img{opacity: 0.6;filter:alpha(opacity=60); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solMarketList .li3:hover .dImg img{ transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1); } @media screen and (max-width:1229px) { #obtn .solMarketBox{margin: 48px 0 90px 0;} #obtn .solMarketList{margin-top: 20px;} #obtn .solMarketList ul{margin: 0 -15px;} #obtn .solMarketList li{padding: 0 15px;} } @media screen and (max-width:1023px) { #obtn .solMarketBox{margin: 45px 0 70px 0;} #obtn .solMarketList ul{margin: 0 -10px;} #obtn .solMarketList li{margin-top: 20px; padding: 0 10px;} #obtn .solMarketList .li3 .tIco{margin-top: 25px;} #obtn .solMarketList .li3 h3{font-size: 20px; margin-top: 10px;} #obtn .solMarketList .li3 .dText{margin: 15px 0 30px 0; font-size: 15px; line-height: 28px;} } @media screen and (max-width:767px) { #obtn .solMarketBox{margin: 35px 0 40px 0;} #obtn .solMarketBox .p1{font-size: 14px;} #obtn .solMarketList{margin-top: 10px;} #obtn .solMarketList ul{margin: 0 -7px;} #obtn .solMarketList li{ width: 50%; margin-top: 15px; padding: 0 7px;} #obtn .solMarketList .li3 .tIco{margin-top: 20px;} #obtn .solMarketList .li3 h3{font-size: 18px; line-height: 30px;} #obtn .solMarketList .li3 .dText{margin: 10px 0 20px 0; font-size: 14px; line-height: 26px;} } #obtn .solPropertyInfo{float: left; width: 100%; margin: 52px 0 105px 0;} #obtn .solPropertyInfo .p1{float: left; width: 100%; text-align: center; color:#444444; font-size: 15px; line-height: 24px; margin-top: 13px;} #obtn .solPropertyList{float: left; width: 100%; margin-top: 105px;} #obtn .solPropertyList ul{margin: 0 -55px;} #obtn .solPropertyList li{float: left; width: 25%; padding: 0 55px; position: relative; } #obtn .solPropertyList li:after{position: absolute; content: ''; width: 1px; height: 90%; top:0; right: 0; background: #e8e8e8} #obtn .solPropertyList li .tIco{float: left; width: 100%; text-align: center; line-height: 0; margin-top: 24px;} #obtn .solPropertyList li .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solPropertyList li:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .solPropertyList li h3{float: left; width: 100%; text-align: center; color:#444444; font-size: 18px; line-height: 40px; margin-top: 40px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solPropertyList li:hover h3{color:#58d498} #obtn .solPropertyList li .dText{float: left; width: 100%; text-align: center; color:#656565; font-size: 14px; line-height: 24px; margin-top: 28px; height: 168px;} @media screen and (max-width:1229px) { #obtn .solPropertyInfo{margin: 52px 0 85px 0;} #obtn .solPropertyList{margin-top: 70px;} #obtn .solPropertyList ul{margin: 0 -30px;} #obtn .solPropertyList li{padding: 0 30px;} #obtn .solPropertyList li h3{margin-top: 30px;} #obtn .solPropertyList li .dText{margin-top: 20px; font-size: 15px;} } @media screen and (max-width:1023px) { #obtn .solPropertyInfo{margin:48px 0 75px 0;} #obtn .solPropertyList{margin-top: 35px;} #obtn .solPropertyList ul{margin: 0 -15px;} #obtn .solPropertyList li{padding: 0 15px;} #obtn .solPropertyList li .tIco img{width: 60px;} #obtn .solPropertyList li h3{font-size: 20px; margin-top: 15px; line-height: 35px;} #obtn .solPropertyList li .dText{margin-top: 15px; font-size: 14px;} } @media screen and (max-width:767px) { #obtn .solPropertyList{margin-top: 10px;} #obtn .solPropertyInfo{margin: 35px 0 40px 0;} #obtn .solPropertyInfo .p1{font-size: 14px;} #obtn .solPropertyList li{width: 100%;} #obtn .solPropertyList li:after{right: auto; left: 0; bottom: 0;top: auto; height: 1px; width: 100%;} #obtn .solPropertyList li:last-child:after{height: 0;} #obtn .solPropertyList li .dText{font-size: 14px; height: auto; padding-bottom: 20px;} } #obtn .bottomSideBox{float: left; width: 100%; border-top:1px solid #dbdbdb;} #obtn .bottomSideList{float: left; width: 100%;padding-left: 70px;} #obtn .bottomSideList li{float: left; width: 25%; padding:75px 0; position: relative; text-align:center;} #obtn .bottomSideList li .la{ display:inline-block; vertical-align:top; text-align:left; position:relative; padding-left:65px;} #obtn .bottomSideList li .lIco{position:absolute; left: 0; top:50%; margin-top: -30px; line-height: 0;} #obtn .bottomSideList li .tH1{ display:block; color:#444444; font-size: 18px; line-height: 30px;} #obtn .bottomSideList li .text{ display:block; color:#777777; font-size: 15px; line-height: 26px;} @media screen and (max-width:1229px) { #obtn .bottomSideList li{padding: 65px 0;} } @media screen and (max-width:1023px) { #obtn .bottomSideList{padding: 15px 0;} #obtn .bottomSideList li{width: 50%;padding: 20px 0;} #obtn .bottomSideList li .la{ min-width:210px;} } @media screen and (max-width:767px) { #obtn .bottomSideList li{padding: 10px 0} #obtn .bottomSideList li .lIco{margin-top:0; top:4px;} #obtn .bottomSideList li .lIco img{width: 40px;} #obtn .bottomSideList li .tH1{font-size: 18px; line-height:26px;} #obtn .bottomSideList li .text{font-size: 14px; line-height: 22px; min-height:44px;} #obtn .bottomSideList li .la{ padding-left:44px;} } /*工业互联网*/ #obtn .solSecondLevel.IndustrialSec li{width: 20%;} @media screen and (max-width:767px) { #obtn .solSecondLevel.IndustrialSec li{width: 33.333%;} } #obtn .solVisualized.IndustrialBox{margin: 76px 0 96px 0;} #obtn .solVisualList.IndustrialList .li1{float: left; width: 100%; background: #fff; box-shadow: 0 3px 27px rgba(183,183,184,0); -moz-box-shadow: 0 3px 27px rgba(183,183,184,0); -webkit-box-shadow: 0 3px 27px rgba(183,183,184,0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solVisualList.IndustrialList .li1:hover{ box-shadow: 0 3px 27px rgba(183,183,184,0.3); -moz-box-shadow: 0 3px 27px rgba(183,183,184,0.3); -webkit-box-shadow: 0 3px 27px rgba(183,183,184,0.3); } #obtn .solVisualList.IndustrialList .li1 .lImg{width: 42.5%;} #obtn .solVisualList.IndustrialList .li1 .textInfo{width: 502px; height: 326px; top:105px; left: 90px;} #obtn .solVisualList.IndustrialList .li1 .rightBox{width: 42%;} #obtn .solVisualList.IndustrialList .li1 .rightBox dd{padding: 0 30px 0 0;} #obtn .solVisualList.IndustrialList .li1 .rightBox dd .ico{float: left; width: 100%; position: static;} #obtn .solVisualList.IndustrialList .li1 .rightBox dd h3{margin-top: 29px; padding-top: 11px; position: relative;line-height: 45px;} #obtn .solVisualList.IndustrialList .li1 .rightBox dd h3:after{ position: absolute; content: ''; width: 30px; height: 2px; left:0; top: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solVisualList.IndustrialList .li1 .rightBox dd:hover h3:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } @media screen and (max-width:1229px) { #obtn .solVisualized.IndustrialBox{margin: 56px 0 76px 0;} #obtn .solVisualList.IndustrialList .li1 .textInfo{width: 420px; height: 326px; top:55px; left: 70px;} } @media screen and (max-width:1023px) { #obtn .solVisualized.IndustrialBox{margin: 40px 0 60px 0;} #obtn .solVisualList.IndustrialList .li1 .textInfo{width: 320px; height: 290px; top:50px; left: 50px;} #obtn .solVisualList.IndustrialList .li1 .rightBox dl{margin-top: 20px;} #obtn .solVisualList.IndustrialList .li1 .rightBox dl dd{margin-top: 25px;} #obtn .solVisualList.IndustrialList .li1 .rightBox dd h3{margin-top: 15px;line-height: 40px;} } @media screen and (max-width:767px) { #obtn .solVisualized.IndustrialBox{margin: 35px 0 40px 0;} #obtn .solVisualList.IndustrialList .li1 .lImg{width: 100%;} #obtn .solVisualList.IndustrialList .li1 .textInfo{width:100%; height:100%; top:0; left:0;} #obtn .solVisualList.IndustrialList .li1 .rightBox{width: 100%;} #obtn .solVisualList.IndustrialList .li1 .rightBox dl{margin:15px 0;} #obtn .solVisualList.IndustrialList .li1 .rightBox dl dd{width: 50%;padding: 0; margin-top: 15px; text-align: center;} #obtn .solVisualList.IndustrialList .li1 .rightBox dl dd h3{font-size: 16px; line-height: 35px; margin-top:10px;padding-top: 5px;} #obtn .solVisualList.IndustrialList .li1 .rightBox dd h3:after{left: 50%; margin-left: -15px;} } #obtn .solVisualList.indusRight .li1{background: #f7f7f7;} #obtn .solVisualList.indusRight .lImg{float: right;} #obtn .solVisualList.indusRight .li1 .rightBox{width: 50%;} #obtn .solVisualList.indusRight .li1 .textInfo{left: auto; right: 90px;} @media screen and (max-width:1229px) { #obtn .solVisualList.indusRight .li1 .rightBox{width: 52%;} #obtn .solVisualList.indusRight .li1 .textInfo{left: auto; right: 70px;} } @media screen and (max-width:1023px) { #obtn .solVisualList.indusRight .li1 .textInfo{left: auto; right:50px;} #obtn .solVisualList.indusRight .li1 .rightBox dl{padding-right: 60px;} #obtn .solVisualList.indusRight .li1 .rightBox dl dd h3{font-size: 18px; line-height: 30px; height: 71px;} } @media screen and (max-width:767px) { #obtn .solVisualList.indusRight .li1 .textInfo{right: 0;} #obtn .solVisualList.indusRight .li1 .rightBox{width: 100%;} #obtn .solVisualList.indusRight .li1 .rightBox dl{padding-right: 0;} #obtn .solVisualList.indusRight .li1 .rightBox dl dd h3{font-size: 16px; line-height: 35px; height: auto;} } #obtn .WarehouseBox{float: left; width: 100%; margin-bottom: 130px;} #obtn .WarehouseBox .tImg{float: left; width: 100%; height: 400px; line-height: 0; position: relative; background: #0e20a9; background: -webkit-linear-gradient(left,#09bbfe,#0e20a9); background: -o-linear-gradient(left,#09bbfe,#0e20a9); background: -moz-linear-gradient(left,#09bbfe,#0e20a9); background: -ms-linear-gradient(left,#09bbfe,#0e20a9); background: linear-gradient(to right,#09bbfe,#0e20a9); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#09bbfe), color-stop(100%,#0e20a9)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#09bbfe', endColorstr='#0e20a9',GradientType=0); } #obtn .WarehouseBox .tImg .box{position: absolute; z-index:1; left: 0; top:0; width: 100%; height: 100%; opacity: 0.23;filter:alpha(opacity=23);} #obtn .WarehouseBox .tImg .wordsBox{float: left; width: 100%; padding: 0 95px; margin-top:50px; position: relative; z-index:3;} #obtn .WarehouseBox .tImg .wordsBox .pageTit{color:#fff;} #obtn .WarehouseBox .tImg .wordsBox .p1{float: left; width: 100%; text-align: center; color:#fff; font-size: 15px; line-height: 24px; margin-top: 14px;} #obtn .WarehouseBox .solMarketList{position: relative; z-index: 3; margin-top: -170px;} #obtn .WarehouseBox .solMarketList ul{float: left; width: 100%; padding: 0 80px; margin: 0;} #obtn .WarehouseBox .solMarketList li{padding: 0 15px;} #obtn .WarehouseBox .solMarketList .li3{ box-shadow: 0 0 13px rgba(120,131,144,0.3); -moz-box-shadow: 0 0 13px rgba(120,131,144,0.3); -webkit-box-shadow: 0 0 13px rgba(120,131,144,0.3); } #obtn .WarehouseBox .solMarketList .dText{height: 180px;} @media screen and (max-width:1229px) { #obtn .WarehouseBox{margin-bottom: 100px;} #obtn .WarehouseBox .tImg .wordsBox{padding: 0 70px;} #obtn .WarehouseBox .solMarketList{margin-top: -150px;} #obtn .WarehouseBox .solMarketList ul{padding: 0 55px;} } @media screen and (max-width:1023px) { #obtn .WarehouseBox{margin-bottom: 70px;} #obtn .WarehouseBox .tImg{ height:auto; padding-bottom: 50px;} #obtn .WarehouseBox .tImg .wordsBox{padding: 0 50px;} #obtn .WarehouseBox .solMarketList{margin-top:-20px;} #obtn .WarehouseBox .solMarketList ul{padding: 0;} #obtn .WarehouseBox .solMarketList li{padding: 0;} #obtn .WarehouseBox .solMarketList .li3:hover{position: relative; z-index: 3;} } @media screen and (max-width:767px) { #obtn .WarehouseBox{margin-bottom:40px;} #obtn .WarehouseBox .tImg .wordsBox{margin-top: 35px;padding: 0 20px;} #obtn .WarehouseBox .tImg{ height:auto; padding-bottom: 35px;} #obtn .WarehouseBox .tImg .wordsBox .p1{font-size: 14px;} #obtn .WarehouseBox .solMarketList{margin-top: 0;} #obtn .WarehouseBox .solMarketList li{margin-top: 0;} #obtn .WarehouseBox .solMarketList .li3 .tIco img{width: 50px; height: 50px;} #obtn .WarehouseBox .solMarketList .li3 .dText{height: 156px;} } #obtn .safeManageBox{float: left; width: 100%; margin: 53px 0 70px 0;} #obtn .safeManageBox .p1{float: left; width: 100%; text-align: center; color:#444444; font-size: 15px; line-height: 24px; margin-top: 13px; padding: 0 120px;} #obtn .safeManageBox .safeManageInfo{float: left; width: 100%; margin-top: 60px; background: #fff; box-shadow: 0 7px 21px rgba(176,176,177,0.3); -moz-box-shadow: 0 7px 21px rgba(176,176,177,0.3); -webkit-box-shadow: 0 7px 21px rgba(176,176,177,0.3); } #obtn .safeManageBox .safeManageInfo .safeManLeft{float: left; width: 48.33%; padding: 27px 40px 0 50px;} #obtn .safeManageBox .safeManageInfo .safeManRight{float: right; width: 51.67%; line-height: 0; background: #091c36;} #obtn .safeManageBox .safeManageInfo .safeManRight img{opacity: 1;filter:alpha(opacity=40);} #obtn .safeManageBox .safeManLeft dl{float: left; width: 100%;} #obtn .safeManageBox .safeManLeft dd{float: left; width: 100%; margin-top: 28px; padding-left: 83px; position: relative; cursor: pointer;} #obtn .safeManageBox .safeManLeft dd .lImg{position: absolute; left: 0; top:0; line-height: 0;} #obtn .safeManageBox .safeManLeft dd .lImg img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .safeManageBox .safeManLeft dd:hover .lImg img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .safeManageBox .safeManLeft dd h3{float: left; width: 100%; color:#444444; font-size: 18px; line-height: 35px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .safeManageBox .safeManLeft dd:hover h3{ color:#58d498;} #obtn .safeManageBox .safeManLeft dd .p2{float: left; width: 100%; font-size: 14px; color:#656565; line-height: 24px;} @media screen and (max-width:1229px) { #obtn .safeManageBox .p1{padding: 0 100px;} #obtn .safeManageBox .safeManageInfo{margin-top: 45px;} #obtn .safeManageBox .safeManageInfo .safeManLeft{padding: 20px 30px 0 35px;} #obtn .safeManageBox .safeManLeft dd{margin-top: 20px; padding-left: 70px;} #obtn .safeManageBox .safeManLeft dd h3{font-size: 20px; line-height: 30px;} #obtn .safeManageBox .safeManLeft dd .lImg img{width: 50px;} #obtn .safeManageBox .safeManLeft dd .p2{font-size: 15px;} } @media screen and (max-width:1023px) { #obtn .safeManageBox{margin: 50px 0 60px 0;} #obtn .safeManageBox .p1{padding: 0 50px;} #obtn .safeManageBox .safeManageInfo{margin-top: 35px;} #obtn .safeManageBox .safeManageInfo .safeManLeft{width: 100%;padding:10px 30px 20px 30px;} #obtn .safeManageBox .safeManageInfo .safeManRight{width: 100%;} } @media screen and (max-width:767px) { #obtn .safeManageBox{margin: 35px 0 40px 0;} #obtn .safeManageBox .p1{padding: 0; font-size: 14px;} #obtn .safeManageBox .safeManageInfo{margin-top: 25px;} #obtn .safeManageBox .safeManageInfo .safeManLeft{padding: 10px 15px 20px 15px;} #obtn .safeManageBox .safeManLeft dd{padding-left: 55px; margin-top: 15px;} #obtn .safeManageBox .safeManLeft dd .lImg img{width: 45px;} #obtn .safeManageBox .safeManLeft dd h3{font-size: 18px;} #obtn .safeManageBox .safeManLeft dd .p2{font-size: 14px;} } #obtn .plantAreaBox{float: left; width: 100%; background: url("_im_g/sol68.jpg") no-repeat center; background-size: cover;} #obtn .plantAreaInfo{float: left; width: 100%; margin: 90px 0 140px 0;} #obtn .plantAreaInfo .ul1{float: left; width: 100%; margin-top: 51px;} #obtn .plantAreaInfo .ul1 li{float: left; width: 50%; background: #fff; background: rgba(255,255,255,0.91); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .plantAreaInfo .ul1 li:last-child{background: #1c71e0; background: rgba(28,113,224,0.91);} #obtn .plantAreaInfo .ul1 li:hover{ position: relative; z-index: 2; box-shadow: 0 7px 21px rgba(176,176,177,0.3); -moz-box-shadow: 0 7px 21px rgba(176,176,177,0.3); -webkit-box-shadow: 0 7px 21px rgba(176,176,177,0.3); } #obtn .plantAreaInfo .ul1 li .table{float: left; width: 100%; height: 372px; display: table; padding: 0 95px;} #obtn .plantAreaInfo .ul1 li .tableCell{display: table-cell; vertical-align: middle;} #obtn .plantAreaInfo .ul1 li .tableCell h3{float: left; width: 100%; color:#333333; font-size: 18px; line-height: 38px; padding-bottom: 11px; position: relative; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .plantAreaInfo .ul1 li:last-child .tableCell h3{color:#fff;} #obtn .plantAreaInfo .ul1 li:hover .tableCell h3{color:#58d498;} #obtn .plantAreaInfo .ul1 li .tableCell h3:after{position: absolute; content: ''; width: 30px; height: 2px; left:0; bottom: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .plantAreaInfo .ul1 li:last-child .tableCell h3:after{ background: #fff; } #obtn .plantAreaInfo .ul1 li:hover .tableCell h3:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .plantAreaInfo .ul1 li .tableCell .p3{float: left; width: 100%; color:#656565; font-size: 15px; line-height: 28px; margin-top: 20px;} #obtn .plantAreaInfo .ul1 li:last-child .tableCell .p3{color:#fff;} @media screen and (max-width:1229px) { #obtn .plantAreaInfo{margin: 70px 0 100px 0} #obtn .plantAreaInfo .ul1 li .table{padding: 0 70px;} } @media screen and (max-width:1023px) { #obtn .plantAreaInfo{margin: 60px 0 80px 0;} #obtn .plantAreaInfo .ul1{margin-top: 40px;} #obtn .plantAreaInfo .ul1 li .table{padding: 0 50px;} #obtn .plantAreaInfo .ul1 li .tableCell .p3{font-size: 15px; line-height: 26px;} } @media screen and (max-width:767px) { #obtn .plantAreaInfo{margin:40px 0;} #obtn .plantAreaInfo .ul1{margin-top: 20px;} #obtn .plantAreaInfo .ul1 li{width: 100%;} #obtn .plantAreaInfo .ul1 li .table{padding:20px 25px; height: auto;} #obtn .plantAreaInfo .ul1 li .tableCell h3{font-size:20px; padding-bottom: 5px;} #obtn .plantAreaInfo .ul1 li .tableCell .p3{margin-top: 15px; font-size: 14px; line-height: 24px;} } /*智慧园区*/ #obtn .pageParkBox{float: left; width: 100%; margin:90px 0 120px 0;} #obtn .pageParkBox .lImg{float: left; width: 46.666%; display: table; height:530px;} #obtn .pageParkBox .lImg .table{display: table-cell; vertical-align: middle;line-height: 0;} #obtn .pageParkBox .rightText{float: right; width: 47.5%; height:530px; display: table;} #obtn .pageParkBox .rightText .table{display: table-cell; vertical-align: middle;} #obtn .pageParkBox .rightText .pageTit{text-align: left;} #obtn .pageParkBox .rightText .p1{float: left; width: 100%; color:#444444; font-size: 15px; line-height: 24px; margin-top: 25px;} #obtn .pageParkBox .rightText .ulList{float: left; width: 100%;} #obtn .pageParkBox .rightText .ulList li{float: left; width: 33.3333%; margin-top: 55px; text-align: center; padding-right: 85px;} #obtn .pageParkBox .rightText .ulList li .inBox{display: block; width: 100%;} #obtn .pageParkBox .rightText .ulList li i{display: block; width: 100%; line-height: 0;} #obtn .pageParkBox .rightText .ulList li i img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .pageParkBox .rightText .ulList li .inBox:hover i img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .pageParkBox .rightText .ulList li em{display: block; width: 100%; color:#444444; font-size: 16px; line-height: 35px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .pageParkBox .rightText .ulList li .inBox:hover em{color:#58d498} @media screen and (max-width:1229px) { #obtn .pageParkBox{ margin:80px 0 100px 0;} #obtn .pageParkBox .lImg{height: 470px;} #obtn .pageParkBox .rightText{height: 470px;} #obtn .pageParkBox .rightText .ulList li{padding-right: 60px; margin-top: 40px;} } @media screen and (max-width:1023px) { #obtn .pageParkBox{margin: 60px 0 70px 0;} #obtn .pageParkBox .lImg{height: 370px;} #obtn .pageParkBox .rightText{height: 370px;} #obtn .pageParkBox .rightText .p1{margin-top: 15px; font-size: 15px;} #obtn .pageParkBox .rightText .ulList li{padding-right: 10px; margin-top: 20px;} #obtn .pageParkBox .rightText .ulList li em{font-size: 20px;} #obtn .pageParkBox .rightText .ulList li .inBox i img{width: 50px;} } @media screen and (max-width:767px) { #obtn .pageParkBox{margin: 40px 0;} #obtn .pageParkBox .lImg{width: 100%; height: auto;} #obtn .pageParkBox .rightText{width: 100%; height: auto; margin-top: 20px;} #obtn .pageParkBox .rightText .p1{font-size: 14px; margin-top: 10px;} #obtn .pageParkBox .rightText .ulList li{margin-top: 15px;} #obtn .pageParkBox .rightText .ulList li .inBox i img{width: 40px;} #obtn .pageParkBox .rightText .ulList li em{font-size: 16px; line-height: 25px;} } #obtn .pageParkBox.two .lImg{float: right; width: 53.333%; height: 490px;} #obtn .pageParkBox.two .rightText{float: left; width: 43.333%; height: 490px;} @media screen and (max-width:1229px) { #obtn .pageParkBox.two .lImg{ height: 450px;} #obtn .pageParkBox.two .rightText{ height: 450px;} #obtn .pageParkBox.two .rightText .ulList li{padding-right: 55px;} } @media screen and (max-width:1023px) { #obtn .pageParkBox.two .lImg{ height: 390px;} #obtn .pageParkBox.two .rightText{ height: 390px;} #obtn .pageParkBox.two .rightText .ulList li{padding-right:10px;} } @media screen and (max-width:767px) { #obtn .pageParkBox.two .lImg{width: 100%; height: auto;} #obtn .pageParkBox.two .rightText{width: 100%; height:auto;} } #obtn .pageParkBox.three .lImg{height: 490px;} #obtn .pageParkBox.three .rightText{height: 490px;} #obtn .pageParkBox.three .rightText .ulList li{width: 35%;} @media screen and (max-width:1229px) { #obtn .pageParkBox.three .lImg{ height: 450px;} #obtn .pageParkBox.three .rightText{ height: 450px;} #obtn .pageParkBox.three .rightText .ulList li{padding-right: 55px;} } @media screen and (max-width:1023px) { #obtn .pageParkBox.three .lImg{ height: 390px;} #obtn .pageParkBox.three .rightText{ height: 390px;} #obtn .pageParkBox.three .rightText .ulList li{padding-right:10px;} } @media screen and (max-width:767px) { #obtn .pageParkBox.three .lImg{width: 100%; height: auto;} #obtn .pageParkBox.three .rightText{width: 100%; height:auto;} #obtn .pageParkBox.three .rightText .ulList li{width: 50%; padding-right:10px;} } #obtn .pageParkBox.four .lImg{float: right; width: 53.333%; height: 490px;} #obtn .pageParkBox.four .rightText{float: left; width: 43.333%; height: 490px;} #obtn .pageParkBox.four .rightText .ulList li{width: 35%;padding-right: 60px;} @media screen and (max-width:1229px) { #obtn .pageParkBox.four .lImg{ height: 450px;} #obtn .pageParkBox.four .rightText{ height: 450px;} #obtn .pageParkBox.four .rightText .ulList li{width: 38%;padding-right: 45px;} } @media screen and (max-width:1023px) { #obtn .pageParkBox.four .lImg{ height: 390px;} #obtn .pageParkBox.four .rightText{ height: 390px;} #obtn .pageParkBox.four .rightText .ulList li{padding-right:10px;} } @media screen and (max-width:767px) { #obtn .pageParkBox.four .lImg{width: 100%; height: auto;} #obtn .pageParkBox.four .rightText{width: 100%; height:auto;} #obtn .pageParkBox.four .rightText .ulList li{width: 50%; padding-right:10px;} } #obtn .downParkBox{float: left; width: 100%; position: relative; background:#31cdb0; background: -webkit-linear-gradient(top,#31cdb0,#3551a4); background: -o-linear-gradient(top,#31cdb0,#3551a4); background: -moz-linear-gradient(top,#31cdb0,#3551a4); background: -ms-linear-gradient(top,#31cdb0,#3551a4); background: linear-gradient(to bottom,#31cdb0,#3551a4); background: -webkit-gradient(linear, top bottom,top right, color-stop(0%,#31cdb0), color-stop(100%,#3551a4)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .downParkBox .parkBg{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity: 0.04;filter:alpha(opacity=4);} #obtn .downParkList{float: left; width: 100%; margin: 90px 0 115px 0; position: relative; z-index: 3;} #obtn .downParkList ul{margin: 0 -6px;} #obtn .downParkList li{float: left; width: 25%; padding: 0 6px;} #obtn .downParkList li .li3{float: left; width: 100%; background: #fff; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .downParkList li .li3:hover{ box-shadow: 0 0 13px rgba(120,131,144,0.3); -moz-box-shadow: 0 0 13px rgba(120,131,144,0.3); -webkit-box-shadow: 0 0 13px rgba(120,131,144,0.3); } #obtn .downParkList li .li3 .tIco{float: left; width: 100%; line-height: 0; margin-top:70px; text-align: center;} #obtn .downParkList li .li3 .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .downParkList li .li3:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .downParkList li .li3 h3{float: left; width: 100%; text-align: center; color:#444444; font-size: 18px; line-height: 35px; padding-bottom: 12px; position: relative; margin-top: 15px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .downParkList li .li3:hover h3{color:#58d498;} #obtn .downParkList li .li3 h3:after{position: absolute; content: ''; width: 30px; height: 2px; left: 50%; margin-left: -15px; bottom: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .downParkList li .li3:hover h3:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .downParkList li .li3 .dText{float: left; width: 100%; text-align: center; color:#656565; font-size: 15px; line-height: 28px; padding: 0 35px; margin-top:39px; margin-bottom:31px; height: 196px;} @media screen and (max-width:1229px) { #obtn .downParkList{ margin: 80px 0 90px 0;} #obtn .downParkList li .li3 .tIco{margin-top: 50px;} #obtn .downParkList li .li3 .dText{margin-top: 25px;} } @media screen and (max-width:1023px) { #obtn .downParkList{ margin:50px 0 60px 0;} #obtn .downParkList li{width: 50%; margin-top: 10px;} #obtn .downParkList li .li3 h3{font-size: 20px;} #obtn .downParkList li .li3 .dText{ height: 140px; font-size: 15px;} } @media screen and (max-width:767px) { #obtn .downParkList{ margin:30px 0 40px 0;} #obtn .downParkList li{width:100%;} #obtn .downParkList li .li3 .tIco{margin-top: 25px;} #obtn .downParkList li .li3 h3{font-size: 18px; line-height: 30px; margin-top: 10px; padding-bottom: 10px;} #obtn .downParkList li .li3 .dText{padding:0 20px; margin:15px 0 25px 0; height: auto;} } #obtn .ParkManagement{float: left; width: 100%; margin: 62px 0 82px 0;} #obtn .ParkManagement ul{margin: 0 -70px;} #obtn .ParkManagement li{float: left; width: 33.333%; padding: 0 70px;} #obtn .ParkManagement li .li4{float: left; width: 100%; background: #fff; overflow: hidden; position: relative; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .ParkManagement li .li4:hover{ box-shadow: 0 0 13px rgba(120,131,144,0.3); -moz-box-shadow: 0 0 13px rgba(120,131,144,0.3); -webkit-box-shadow: 0 0 13px rgba(120,131,144,0.3); } #obtn .ParkManagement li .li4 .dImg{position: absolute; right: -30px; bottom: -20px; line-height: 0; opacity: 0.17;filter:alpha(opacity=17);} #obtn .ParkManagement li .li4 h3{float: left; width: 100%; color:#333333; font-size: 20px; line-height: 35px; margin-top: 60px; text-align: center; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .ParkManagement li .li4:hover h3{color:#58d498;} #obtn .ParkManagement li .li4 .p1{float: left; width: 100%; margin:14px 0 53px 0; color:#656565; font-size: 15px; line-height: 40px; text-align: center;} @media screen and (max-width:1229px) { #obtn .ParkManagement{margin: 60px 0 70px 0} #obtn .ParkManagement ul{margin: 0 -50px;} #obtn .ParkManagement li{padding: 0 50px;} } @media screen and (max-width:1023px) { #obtn .ParkManagement{margin: 50px 0 60px 0} #obtn .ParkManagement ul{margin: 0 -20px;} #obtn .ParkManagement li{padding: 0 20px;} #obtn .ParkManagement li .li4 .dImg img{width: 150px;} #obtn .ParkManagement li .li4 h3{margin-top:45px;} #obtn .ParkManagement li .li4 .p1{margin: 14px 0 40px 0; line-height: 35px;} } @media screen and (max-width:767px) { #obtn .ParkManagement{margin:30px 0 40px 0;} #obtn .ParkManagement li{width: 100%; margin-top: 10px;} #obtn .ParkManagement li .li4 h3{margin-top: 30px;font-size: 18px;} #obtn .ParkManagement li .li4 .p1{font-size: 15px; line-height: 30px; margin: 10px 0 30px 0;} } /*交通枢纽*/ #obtn .solSecondLevel.trafficBox li{width: 33.333%;} #obtn .hubComprehensive{float: left; width: 100%; margin: 80px 0 120px 0;} #obtn .hubComprehensive .downParkList{margin: 70px 0 0 0;} #obtn .hubComprehensive .downParkList ul{margin: 0 -12px;} #obtn .hubComprehensive .downParkList li{padding: 0 12px; width: 33.333%;} #obtn .hubComprehensive .downParkList li h3{margin-top: 36px; padding: 35px 0 0 0;} #obtn .hubComprehensive .downParkList li h3:after{bottom: auto; top:0;} #obtn .hubComprehensive .downParkList li .li3 .dText{margin-top: 20px; height: 140px;} @media screen and (max-width:1229px) { #obtn .hubComprehensive{margin: 70px 0 90px 0;} #obtn .hubComprehensive .downParkList{margin-top: 50px;} #obtn .hubComprehensive .downParkList li .li3 .tIco img{width: 70px;} #obtn .hubComprehensive .downParkList li h3{margin-top: 30px;padding:25px 0 0 0;} } @media screen and (max-width:1023px) { #obtn .hubComprehensive{margin:60px 0 70px 0;} #obtn .hubComprehensive .downParkList{margin-top: 30px;} #obtn .hubComprehensive .downParkList ul{margin: 0 -7px;} #obtn .hubComprehensive .downParkList li{padding: 0 7px;} #obtn .hubComprehensive .downParkList li .li3 .tIco img{width: 60px;} #obtn .hubComprehensive .downParkList li h3{margin-top: 20px; padding-top: 20px; font-size: 18px;} #obtn .hubComprehensive .downParkList li .li3 .dText{padding: 0 20px; margin: 15px 0 25px;} } @media screen and (max-width:767px) { #obtn .hubComprehensive{margin:40px 0;} #obtn .hubComprehensive .downParkList{margin-top:15px;} #obtn .hubComprehensive .downParkList li{width: 100%;} #obtn .hubComprehensive .downParkList li .li3 .tIco img{width: 50px;} #obtn .hubComprehensive .downParkList li .li3 .dText{height: auto; font-size: 14px; line-height: 26px;} } #obtn .trafficPassengerBox{float: left; width: 100%; position: relative; background:#265685; background: -webkit-linear-gradient(top,#5196d5,#265685); background: -o-linear-gradient(top,#5196d5,#265685); background: -moz-linear-gradient(top,#5196d5,#265685); background: -ms-linear-gradient(top,#5196d5,#265685); background: linear-gradient(to bottom,#5196d5,#265685); background: -webkit-gradient(linear, top bottom,top right, color-stop(0%,#5196d5), color-stop(100%,#265685)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5196d5', endColorstr='#265685',GradientType=0); } #obtn .trafficPassengerBox .trafficPassBg{position: absolute; left: 0; top:0; width: 100%; height: 100%;} #obtn .trafficPassengerBox .trafficPassInfo{float: left; width: 100%; margin-top: 135px; position: relative; z-index: 2;} #obtn .trafficPassInfo .lImg{float: left; width: 39.5%; line-height: 0;} #obtn .trafficPassInfo .rText{float: right; width: 50%;} #obtn .trafficPassInfo .rText .pageTit{color:#fff; text-align:left;} #obtn .trafficPassInfo .rText dl{float: left; width: 100%; margin-top: 18px;} #obtn .trafficPassInfo .rText dd{float: left; width: 77%; margin-top: 12px; padding: 15px 25px 15px 73px; position: relative; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .trafficPassInfo .rText dd:hover{padding:15px 25px 15px 93px; background: #5196d5; } #obtn .trafficPassInfo .rText dd .lIco{position: absolute; left: 0; top:15px;} #obtn .trafficPassInfo .rText dd .lIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .trafficPassInfo .rText dd:hover .lIco{left: 20px;} #obtn .trafficPassInfo .rText dd:hover .lIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .trafficPassInfo .rText dd h3{float: left; width: 100%; color:#fff; font-size: 18px; line-height: 35px;} #obtn .trafficPassInfo .rText dd .p1{float: left; width: 100%; color:#fff; font-size: 15px; line-height: 24px; height: 48px;} @media screen and (max-width:1229px) { #obtn .trafficPassengerBox .trafficPassInfo{margin-top: 100px;} #obtn .trafficPassInfo .rText dd{width: 100%;} } @media screen and (max-width:1023px) { #obtn .trafficPassengerBox .trafficPassInfo{margin-top:70px;} #obtn .trafficPassInfo .lImg{width: 46%;} #obtn .trafficPassInfo .rText{margin-top: -10px;} #obtn .trafficPassInfo .rText dl{margin-top: 10px;} #obtn .trafficPassInfo .rText dd{padding: 10px 20px 10px 50px; margin-top: 5px;} #obtn .trafficPassInfo .rText dd:hover{padding: 10px 20px 10px 70px;} #obtn .trafficPassInfo .rText dd h3{font-size: 20px;} #obtn .trafficPassInfo .rText dd .p1{font-size: 15px;} #obtn .trafficPassInfo .rText dd .lIco img{width: 40px;} } @media screen and (max-width:767px) { #obtn .trafficPassengerBox .trafficPassInfo{margin:40px 0 30px 0;} #obtn .trafficPassInfo .rText .pageTit{text-align: center;} #obtn .trafficPassInfo .lImg{display: none;} #obtn .trafficPassInfo .rText{width: 100%;} #obtn .trafficPassInfo .rText dd h3{font-size: 18px;} #obtn .trafficPassInfo .rText dd .p1{font-size: 14px;} } #obtn .trafficManaBox{float: left; width: 100%; background: #f7f7f7; position:relative;} #obtn .trafficManaBg{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity: 0.26;filter:alpha(opacity=26);} #obtn .trafficManaInfo{float: left; width: 100%; margin: 50px 0 85px 0; position: relative; z-index: 2;} #obtn .trafficManaIcoList{float: left; width: 100%; margin-top: 90px;} #obtn .trafficManaIcoList ul{margin: 0 -65px;} #obtn .trafficManaIcoList li{float: left; width: 25%; padding: 0 65px; text-align: center;} #obtn .trafficManaIcoList li .box{float: left; width: 100%;} #obtn .trafficManaIcoList li .tIco{float: left; width: 100%; line-height: 0;} #obtn .trafficManaIcoList li .tIco img{background: #fff; background: rgba(255,255,255,0.7); border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .trafficManaIcoList li .box:hover .tIco img{ transform:rotateY(360deg); -ms-transform:rotateY(360deg); -moz-transform:rotateY(360deg); -webkit-transform:rotateY(360deg); -o-transform:rotateY(360deg); } #obtn .trafficManaIcoList li .dText{float: left; width: 100%; text-align: center; color:#444444; font-size:18px; line-height: 40px; margin-top: 25px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .trafficManaIcoList li .box:hover .dText{color:#58d498} @media screen and (max-width:1229px) { #obtn .trafficManaInfo{margin: 50px 0 70px 0;} #obtn .trafficManaIcoList{margin-top:70px;} #obtn .trafficManaIcoList ul{margin: 0 -45px;} #obtn .trafficManaIcoList li{padding: 0 45px;} } @media screen and (max-width:1023px) { #obtn .trafficManaInfo{margin: 50px 0 60px 0;} #obtn .trafficManaIcoList{margin-top:50px;} #obtn .trafficManaIcoList ul{margin: 0 -30px;} #obtn .trafficManaIcoList li{padding: 0 30px;} #obtn .trafficManaIcoList li .dText{font-size: 18px; margin-top: 15px;} } @media screen and (max-width:767px) { #obtn .trafficManaInfo{margin: 40px 0;} #obtn .trafficManaIcoList{margin-top:15px;} #obtn .trafficManaIcoList ul{margin: 0 -20px;} #obtn .trafficManaIcoList li{padding: 0 20px; width: 50%; margin-top: 15px;} #obtn .trafficManaIcoList li .tIco img{width: 100px;} #obtn .trafficManaIcoList li .dText{font-size: 16px; margin-top: 10px; line-height: 30px;} } #obtn .trafficManaInfo .plantAreaInfo{margin: 100px 0 0 0;} #obtn .trafficManaInfo .plantAreaInfo .ul1{margin-top: 0;} #obtn .trafficManaInfo .plantAreaInfo .ul1 li{background: #073d71; background: rgba(7,61,113,0.84); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .trafficManaInfo .plantAreaInfo .ul1 li:last-child{background: #1789e5; background: rgba(23,137,229,0.84);} #obtn .trafficManaInfo .plantAreaInfo .ul1 li .table{height: 200px; padding: 0 70px;} #obtn .trafficManaInfo .plantAreaInfo .ul1 li .tableCell h3{color:#fff} #obtn .trafficManaInfo .plantAreaInfo .ul1 li .tableCell .p3{color:#fff;} #obtn .trafficManaInfo .plantAreaInfo .ul1 li .tableCell h3:after{background: #fff;} #obtn .trafficManaInfo .plantAreaInfo .ul1 li:hover{background: #073d71;} #obtn .trafficManaInfo .plantAreaInfo .ul1 li:hover:last-child{background: #1789e5; } @media screen and (max-width:1229px) { #obtn .trafficManaInfo .plantAreaInfo{margin:70px 0 0 0;} } @media screen and (max-width:1023px) { #obtn .trafficManaInfo .plantAreaInfo{margin:40px 0 0 0;} #obtn .trafficManaInfo .plantAreaInfo .ul1 li .table{padding: 0 40px;} } @media screen and (max-width:767px) { #obtn .trafficManaInfo .plantAreaInfo{margin:25px 0 0 0;} #obtn .trafficManaInfo .plantAreaInfo .ul1 li .table{padding:15px 20px 20px 20px; height: auto} } #obtn .BottomConBox.parkBack2{background: #1dd5e6; background: -webkit-linear-gradient(left,#46aef7,#1dd5e6); background: -o-linear-gradient(left,#46aef7,#1dd5e6); background: -moz-linear-gradient(left,#46aef7,#1dd5e6); background: -ms-linear-gradient(left,#46aef7,#1dd5e6); background: linear-gradient(to right,#46aef7,#1dd5e6); background: -webkit-gradient(linear, top left,top right, color-stop(0%,#46aef7), color-stop(100%,#1dd5e6)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#46aef7', endColorstr='#1dd5e6',GradientType=0); } #obtn .BottomConBox.parkBack2 .BottomConBg{opacity: 0.5;filter:alpha(opacity=50);} /*智慧消防*/ #obtn .solSecondLevel.protectionBox li a .tIco i{border-color:#57e7d1} #obtn .solSecondLevel.protectionBox li a .tIco i:last-child{ opacity: 0;filter:alpha(opacity=0); border:0; background:#16e6c1; background: -webkit-linear-gradient(left,#16e6c1,#1366a0); background: -o-linear-gradient(left,#16e6c1,#1366a0); background: -moz-linear-gradient(left,#16e6c1,#1366a0); background: -ms-linear-gradient(left,#16e6c1,#1366a0); background: linear-gradient(to right,#16e6c1,#1366a0); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#16e6c1), color-stop(100%,#1366a0)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#16e6c1', endColorstr='#1366a0',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .solSecondLevel.protectionBox li.on a .tIco i:last-child{ opacity: 1;filter:alpha(opacity=100); } #obtn .hubComprehensive .p1{float: left; width: 100%; text-align: center; color:#444444; font-size: 16px; line-height: 24px; margin-top: 15px;} #obtn .VisualEmergencyList{float: left; width: 100%; margin-top: 45px; background: #fff;} #obtn .VisualEmergencyList .VisualLeft{float: left; width: 17.25%; height: 657px; background: url("_im_g/sol122.jpg") no-repeat center; background-size: cover;} #obtn .VisualEmergencyList .VisualLeft ul{float: right; width:75%; margin-top: 11px;} #obtn .VisualEmergencyList .VisualLeft li{float: left; width: 100%; margin-top: 73px; color:#ffffff; font-size: 16px; line-height: 52px; text-align: center; cursor: pointer; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .VisualEmergencyList .VisualLeft li.on, #obtn .VisualEmergencyList .VisualLeft li:hover{ background:#0de3ac; background: -webkit-linear-gradient(left,#0de3ac,#98e05f); background: -o-linear-gradient(left,#0de3ac,#98e05f); background: -moz-linear-gradient(left,#0de3ac,#98e05f); background: -ms-linear-gradient(left,#0de3ac,#98e05f); background: linear-gradient(to right,#0de3ac,#98e05f); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#0de3ac), color-stop(100%,#98e05f)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0de3ac', endColorstr='#98e05f',GradientType=0); box-shadow: 0 7px 21px rgba(15,6,6,0.3); -moz-box-shadow: 0 7px 21px rgba(15,6,6,0.3); -webkit-box-shadow: 0 7px 21px rgba(15,6,6,0.3); } #obtn .VisualEmergencyList .VisualRight{float: left; width: 73%; margin-left: 4%;} #obtn .VisualEmergencyList .VisualRight h3{float: left; width: 100%; color:#444444; font-size: 26px; line-height: 48px; padding-bottom: 11px; position: relative; margin-top: 72px;} #obtn .VisualEmergencyList .VisualRight h3:after{position: absolute; content: ''; left: 0; bottom: 0; width: 54px; height: 2px; background:#000;} #obtn .VisualEmergencyList .VisualRight .p2{float: left; width: 100%; color:#656565; font-size: 15px; line-height: 24px; margin-top: 30px;} #obtn .VisualEmergencyList .VisualRight dl{float: left; width: 100%; margin-top: 75px;} #obtn .VisualEmergencyList .VisualRight dd{float: left; width: 33.333%; padding: 0 45px;} #obtn .VisualEmergencyList .VisualRight dd .tImg{float: left; width: 100%; text-align: center; line-height: 0;} #obtn .VisualEmergencyList .VisualRight dd .tImg img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .VisualEmergencyList .VisualRight dd:hover .tImg img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .VisualEmergencyList .VisualRight dd h4{float: left; width: 100%; text-align: center; margin-top: 9px; color:#444444; font-size: 16px; line-height: 40px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .VisualEmergencyList .VisualRight dd:hover h4{color:#58d498} #obtn .VisualEmergencyList .VisualRight dd .dText{float: left; width: 100%; margin-top: 19px; color:#656565; font-size: 15px; line-height: 28px;} #obtn .VisualEmergencyList .VisualRight dl.auxiliary dd{width: 42%;} #obtn .VisualEmergencyList .VisualRight dl.auxiliary dd:last-child{float: right;} @media screen and (max-width:1023px) { #obtn .VisualEmergencyList .VisualLeft{width: 100%; height: 100px;} #obtn .VisualEmergencyList .VisualLeft ul{width: 100%;} #obtn .VisualEmergencyList .VisualLeft li{width: 25%; margin-top: 37px;} #obtn .VisualEmergencyList .VisualLeft li.on, #obtn .VisualEmergencyList .VisualLeft li:hover{width: 25%;} #obtn .VisualEmergencyList .VisualRight{width: 100%; padding: 0 30px;margin-left:0; height: 540px;} #obtn .VisualEmergencyList .VisualRight h3{margin-top: 30px;} #obtn .VisualEmergencyList .VisualRight dl{margin-top: 30px;} #obtn .VisualEmergencyList .VisualRight dd{padding: 0 20px;} #obtn .VisualEmergencyList .VisualRight .p2{font-size: 15px;} #obtn .VisualEmergencyList .VisualRight dd .dText{font-size: 15px; line-height: 26px;} } @media screen and (max-width:767px) { #obtn .hubComprehensive .p1{font-size: 14px; margin-top: 10px;} #obtn .VisualEmergencyList{margin-top: 25px;} #obtn .VisualEmergencyList .VisualLeft li{font-size: 16px;} #obtn .VisualEmergencyList .VisualRight{padding: 0 20px; height: 730px;} #obtn .VisualEmergencyList .VisualRight h3{margin-top: 20px; font-size:20px; line-height: 30px;} #obtn .VisualEmergencyList .VisualRight .p2{margin-top: 15px; font-size: 14px;} #obtn .VisualEmergencyList .VisualRight dl{margin-top: 10px;} #obtn .VisualEmergencyList .VisualRight dd{width: 100%; margin-top: 15px; padding: 0;} #obtn .VisualEmergencyList .VisualRight dd .tImg img{width: 50px;} #obtn .VisualEmergencyList .VisualRight dd h4{font-size: 20px; margin-top: 0;} #obtn .VisualEmergencyList .VisualRight dd .dText{font-size: 14px; line-height: 24px; margin-top: 5px;} #obtn .VisualEmergencyList .VisualRight dl.auxiliary dd{width: 100%;} } #obtn .visualPrevention{float: left; width: 100%; margin: 51px 0 68px 0;} #obtn .visualPrevention .p1{float: left; width: 100%; text-align: center; color:#444444; font-size: 15px; line-height: 24px; margin-top: 11px;} #obtn .visualPrevention .solVisualList.visualPreList{margin-top: 30px;} #obtn .visualPrevention .solVisualList.visualPreList .lImg{float: left; width: 23.75%;} #obtn .visualPrevention .solVisualList.visualPreList .textInfo{width: 332px; height: 303px; left: 28px; top:50px; } #obtn .visualPrevention .solVisualList.visualPreList .textInfo:after{ background: #1366a0; background: -webkit-linear-gradient(left,#1366a0,#26cec8); background: -o-linear-gradient(left,#1366a0,#26cec8); background: -moz-linear-gradient(left,#1366a0,#26cec8); background: -ms-linear-gradient(left,#1366a0,#26cec8); background: linear-gradient(to right,#1366a0,#26cec8); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#1366a0), color-stop(100%,#26cec8)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1366a0', endColorstr='#26cec8',GradientType=0); } #obtn .visualPrevention .solVisualList.visualPreList .rightBox{float: right; width: 65%; margin-right: 3.333%;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dl{float: left; width: 100%; margin-top: 35px;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd{float: left; width: 33.333%; border-right: 1px solid #e2e2e2; margin: 0; padding: 40px 0 10px 0; text-align: center;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd .ico{float: left; width: 100%; line-height: 0; position: static;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd h3{margin-top: 8px; line-height: 40px;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(4), #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(5), #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(6){padding: 30px 0 40px 0;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(3), #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(6){border-right: 0;} @media screen and (max-width:1229px) { #obtn .visualPrevention .solVisualList.visualPreList .textInfo{width: 280px;height: 260px;padding:30px 20px 0 20px;} } @media screen and (max-width:1023px) { #obtn .visualPrevention .solVisualList.visualPreList .lImg{width: 30%;} #obtn .visualPrevention .solVisualList.visualPreList .textInfo{width: 240px;padding:20px 20px 0 20px; top:30px;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox{width: 60%;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd{padding: 25px 0 10px 0;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(4), #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(5), #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(6){padding: 15px 0 25px 0;} #obtn .visualPrevention .solVisualList.visualPreList .li1 .rightBox dl dd h3{font-size: 16px;} } @media screen and (max-width:767px) { #obtn .visualPrevention{margin:40px 0;} #obtn .visualPrevention .p1{font-size: 14px;} #obtn .visualPrevention .solVisualList.visualPreList{margin-top: 20px;} #obtn .visualPrevention .solVisualList.visualPreList .lImg{width: 100%;} #obtn .visualPrevention .solVisualList.visualPreList .textInfo{width: 100%; height: 100%; left: 0; top:0;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox{width: 100%;margin-right:0;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dl{margin: 20px 0;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd{padding: 10px 0 5px 0;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(4), #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(5), #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd:nth-child(6){padding: 5px 0 10px 0;} #obtn .visualPrevention .solVisualList.visualPreList .li1 .rightBox dl dd h3{font-size: 15px; padding: 0 10px; line-height: 25px; height: 50px;} } #obtn .visualPrevention .solVisualList.visualPreList.right{margin-top: 60px} #obtn .visualPrevention .solVisualList.visualPreList.right .lImg{float: right;} #obtn .visualPrevention .solVisualList.visualPreList.right .textInfo{left: auto; right: 34px;} #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox{float: left; margin: 0 0 0 3.333%; } #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox dd{border:0; width: 50%; text-align: left; margin-top:25px;padding:0 120px 0 0;} #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox .p4{float: left; width: 100%; color:#656565; font-size: 15px; line-height: 28px; margin-top: 7px; height: 130px;} @media screen and (max-width:1229px) { #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox dl{margin-top: 20px;} #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox dd{padding:0 50px 0 0; margin-top: 15px;} #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox .p4{font-size: 15px; line-height: 26px;} } @media screen and (max-width:1023px) { #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox dd{padding-right: 25px;} #obtn .visualPrevention .solVisualList.visualPreList .rightBox dd h3{line-height: 30px; margin-top: 0px;} #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox .p4{font-size: 14px; line-height: 24px; height: 120px;} } @media screen and (max-width:767px) { #obtn .visualPrevention .solVisualList.visualPreList.right{margin-top: 20px;} #obtn .visualPrevention .solVisualList.visualPreList.right .textInfo{right: 0;} #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox{margin: 0;} #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox dl{margin-top: 0;} #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox dd{width: 100%; text-align: center; padding: 0 15px;} #obtn .visualPrevention .solVisualList.visualPreList.right .li1 .rightBox dl dd h3{height: auto; padding: 0;} #obtn .visualPrevention .solVisualList.visualPreList.right .rightBox .p4{height: auto;} } #obtn .digitalSystemBox{float: left; width: 100%; position:relative; background: #0e2253; background: -webkit-linear-gradient(left,#0e2253,#0f5ddf); background: -o-linear-gradient(left,#0e2253,#0f5ddf); background: -moz-linear-gradient(left,#0e2253,#0f5ddf); background: -ms-linear-gradient(left,#0e2253,#0f5ddf); background: linear-gradient(to right,#0e2253,#0f5ddf); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#0e2253), color-stop(100%,#0f5ddf)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e2253', endColorstr='#0f5ddf',GradientType=0); } #obtn .digitalSystemBg{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity: 0.07;filter:alpha(opacity=7); } #obtn .digitalSystemInfo{float: left; width: 100%; margin: 53px 0 93px 0; position: relative; z-index: 2;} #obtn .digitalSystemInfo .pageTit{color:#fff;} #obtn .digitalSystemInfo .p1{float:left; width: 100%; text-align: center; margin-top: 25px; font-size: 15px; line-height: 24px; color:#fff;} #obtn .digitalSystemImg{float: left; width: 60%; line-height: 0; margin-top: 90px; margin-left: -55px;} #obtn .digitalSystemTable{float:right; width: 40%; margin-top: 60px;} #obtn .digitalSystemTable dl{float: left; width: 100%; margin-top: -2px;} #obtn .digitalSystemTable dt{float: left; width: 100%; border:2px solid #fff; border:2px solid rgba(255,255,255,0.53); padding: 0 20px; color:#fff; font-size: 16px; line-height: 49px; position: relative; } #obtn .digitalSystemTable dt span{position: relative; z-index: 2;} #obtn .digitalSystemTable dt:after{ position: absolute; content:''; left: 0; top:0; width: 100%; height: 100%; background: #3b45ae; background: -webkit-linear-gradient(left,#3b45ae,#34abe1); background: -o-linear-gradient(left,#3b45ae,#34abe1); background: -moz-linear-gradient(left,#3b45ae,#34abe1); background: -ms-linear-gradient(left,#3b45ae,#34abe1); background: linear-gradient(to right,#3b45ae,#34abe1); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#3b45ae), color-stop(100%,#34abe1)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b45ae', endColorstr='#34abe1',GradientType=0); opacity: 0.53;filter:alpha(opacity=53); } #obtn .digitalSystemTable .ulBox{float: left; width: 100%; padding:16px 23px;border:2px solid #fff; border:2px solid rgba(255,255,255,0.53); margin-top: -2px} #obtn .digitalSystemTable .ulBox li{float: left; width: 33.333%; padding: 0 0 0 15px; line-height: 45px; font-size: 14px; color:#fff;} #obtn .digitalSystemTable .ulBox li:nth-child(4), #obtn .digitalSystemTable .ulBox li:nth-child(5), #obtn .digitalSystemTable .ulBox li:nth-child(6){border-top:1px solid #fff;} @media screen and (max-width:1229px) { #obtn .digitalSystemInfo{margin: 50px 0 70px 0} #obtn .digitalSystemImg{width: 55%;} #obtn .digitalSystemTable{width: 48%;} #obtn .digitalSystemTable .ulBox{padding: 10px 15px;} #obtn .digitalSystemTable .ulBox li{padding-left: 5px; font-size: 15px; line-height: 40px;} } @media screen and (max-width:1023px) { #obtn .digitalSystemInfo{margin: 45px 0 60px 0} #obtn .digitalSystemImg{width:100%; margin-left: 0; text-align: center; margin-top: 40px;} #obtn .digitalSystemImg img{width: 70%;} #obtn .digitalSystemTable{width:100%; margin-top: 40px;} } @media screen and (max-width:767px) { #obtn .digitalSystemInfo{margin: 40px 0} #obtn .digitalSystemInfo .p1{font-size: 14px; margin-top: 10px;} #obtn .digitalSystemImg{margin-top: 20px;} #obtn .digitalSystemTable{margin-top: 20px;} #obtn .digitalSystemTable dt{line-height: 40px; font-size: 18px; padding: 0 15px;} #obtn .digitalSystemTable .ulBox{padding: 5px;} #obtn .digitalSystemTable .ulBox li{font-size: 13px; padding-left: 0; line-height: 36px;} } /*新闻资讯*/ #obtn .slideBoxBg{float: left; width: 100%; background: #f5f7fb;} #obtn .slideBoxBg.on{ position:fixed; left:0; top:0;} #obtn .pz_SideLayerNews{float: left;} #obtn .pz_SideLayerNews .l1{float: left; width: 150px; line-height: 60px;} #obtn .pz_SideLayerNews .l1 a{float: left; width: 100%; color:#444444; font-size: 16px; text-align: center; position: relative} #obtn .pz_SideLayerNews .l1 a:after{position: absolute; content: ''; width: 100%; height:0; bottom: 0; left: 0; background: #40cf8a; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .pz_SideLayerNews .l1.on a, #obtn .pz_SideLayerNews .l1 a:hover{color:#40cf8a; font-weight: bold;} #obtn .pz_SideLayerNews .l1.on a:after, #obtn .pz_SideLayerNews .l1 a:hover:after{ height: 4px;} #obtn .pz_SideLayerNews1{ margin-top:25px;} /*#obtn .searchBox{float: right; width: 300px; height:40px; padding-top: 18px; background: #ebedf0; position: relative; padding-right: 100px; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; }*/ #obtn .searchBox a{font-size: 16px;font-weight: 600;color: #38c28c !important;/*padding: 5px 30px 10px 50px;*/} #obtn .newskuang {float: right; width: 25%; line-height: 60px;overflow: hidden;text-align: left; } #obtn .searchBox p{font-size: 16px;font-weight: 600;color: #38c28c !important;} #obtn .searchBox.on p{font-size: 16px;font-weight: 600;color: #38c28c;padding: 0px 30px 10px 50px;} #obtn .searchBox input{float: left; width: 100%; text-indent: 30px; color:#333; font-size: 16px; background:none; border:0; height: 40px; line-height: 40px;} #obtn .searchBox button{position: absolute; width: 100px; height: 40px; right: 0; top:0; background: #58d398; font-size: 16px; color:#fff; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } @media screen and (max-width:1229px) { #obtn .pz_SideLayerNews .l1{width: 130px;} #obtn .pz_SideLayerNews .l1 a{font-size: 15px;} #obtn .searchBox{width: 280px;} #obtn .searchBox input{font-size: 15px;} #obtn .searchBox button{font-size: 15px;} } @media screen and (max-width:1023px) { #obtn .pz_SideLayerNews{width: 100%;} #obtn .pz_SideLayerNews .l1{width: 20%;} #obtn .searchBox{width: 100%; margin-bottom: 10px;} } @media screen and (max-width:767px) { #obtn .pz_SideLayerNews{height: 50px; overflow-y:hidden; overflow-x:auto;white-space: nowrap;} #obtn .pz_SideLayerNews .l1{line-height: 50px; width: auto;float: none;display: inline-block;white-space: nowrap;} #obtn .pz_SideLayerNews .l1 a{font-size: 14px; padding: 0 15px;} #obtn .searchBox input{font-size: 14px;text-indent:20px;} #obtn .searchBox button{font-size: 14px;} #obtn .slideBoxBg.on .searchBox{ display:none;} #obtn .pz_SideLayerNews .l1.on a:after, #obtn .pz_SideLayerNews .l1 a:hover:after{ height:3px;} } #obtn .pageNewsList{float: left; width: 71.25%; margin:50px 0 100px 0;} #obtn .pageNewsList ul{float: left; width: 100%;} #obtn .pageNewsList li{float: left; width: 100%;} #obtn .pageNewsList li a{float: left; width: 100%; padding: 30px 20px; background: #fff;} #obtn .pageNewsList li a .lImg{float: left; width: 40%; line-height: 0; overflow: hidden;} #obtn .pageNewsList li a .lImg img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .pageNewsList li a:hover{ position: relative; z-index: 2; box-shadow: 0 0 30px rgba(204,211,220,0.3); -moz-box-shadow: 0 0 30px rgba(204,211,220,0.3); -webkit-box-shadow: 0 0 30px rgba(204,211,220,0.3); } #obtn .pageNewsList li a:hover .lImg img{ transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1); } #obtn .pageNewsList li a .rText{float: right; width: 55%; text-align: left;} #obtn .pageNewsList li a .rText h3{float: left; width: 100%; color:#444444; font-size: 18px; line-height: 26px; max-height:72px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #obtn .pageNewsList li a:hover .rText h3{color:#58d498} #obtn .pageNewsList li a .rText h3 b{font-weight:400;} #obtn .pageNewsList li a .rText .p1{float: left; width: 100%; margin-top: 13px; color:#929292; font-size: 14px; line-height: 28px; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; } #obtn .pageNewsList li a .newLabel{float: left; width: 100%; margin-top: 5px;} #obtn .pageNewsList li a .newLabel span{float: left; min-width: 70px; /**padding: 0 12px;**/ height: 30px; /**background: #f7f7f7;**/ font-size: 12px; color:#808080; line-height: 30px; text-align: center; margin-right: 10px;} @media screen and (max-width:1229px) { #obtn .pageNewsList{margin: 40px 0 70px 0;} #obtn .pageNewsList li a{padding:20px 15px;} #obtn .pageNewsList li a .rText h3{height: 36px; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical; } #obtn .pageNewsList li a .rText .p1{ overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical; } #obtn .pageNewsList li a .newLabel{margin-top: 30px;} } @media screen and (max-width:1023px) { #obtn .pageNewsList{width: 100%; margin: 30px 0 40px 0;} } @media screen and (max-width:767px) { #obtn .pageNewsList{margin: 10px 0 30px 0;} #obtn .pageNewsList li{margin-top: 15px;} #obtn .pageNewsList li a{padding:0;background: #f5f5f5;} #obtn .pageNewsList li a .lImg{width: 100%;} #obtn .pageNewsList li a .lImg img{width: 100%;} #obtn .pageNewsList li a .rText{width: 100%; padding: 0 15px 15px 15px;} #obtn .pageNewsList li a .rText h3{font-size: 16px; margin-top: 10px;} #obtn .pageNewsList li a .rText .p1{margin-top: 7px; line-height: 26px;} #obtn .pageNewsList li a .newLabel{margin-top:15px;} #obtn .pageNewsList li a .newLabel span{background: #fff;margin-right: 6px; margin-top: 5px;} } /* 分页 */ #obtn .wack1{ float:right; padding:60px 0 0 0; text-align:center;} #obtn .wack1 .pz_fy{ display:inline-block; *display:inline; *zoom:1;} #obtn .wack1 .pz_fy a { float:left; width:41px; height:33px; line-height:33px; border-radius:2px; -moz-border-radius:2px; -webkit-border-radius:2px; border: #cccccc 1px solid; color:#333333; font-size:14px; font-family:Arial; margin:0 5px;} #obtn .wack1 .pz_fy a:hover, #obtn .wack1 .pz_fy a.on{color:#fff; border:#58d398 1px solid; background:#58d398;} #obtn .wack1 .pz_fy .l_fy{ width:60px;} #obtn .wack1 .pz_fy .r_fy{width: 74px;} @media screen and (max-width:1023px){ #obtn .wack1{padding:35px 0 0 0; width: 100%;} #obtn .wack1 .fy_pc{ text-align:center; font-size:14px; color:#272727; padding:5px 0;} #obtn .wack1 .fy_pc a{ padding:5px 25px; color:#fff; border:solid 1px #58d398; background:#58d398; border-radius:16px; overflow:hidden;} #obtn .wack1 .fy_pc span{ padding:5px 20px; color:#272727;} } #obtn .pageHotNews{float: right; width: 25%;} #obtn .pageHotNews .newsH1{float:left; width: 100%; color:#444444; font-size: 18px; line-height: 35px; margin-top: 40px;} #obtn .pageHotNews ul{float:left; width: 100%; margin-top: -9px;} #obtn .pageHotNews li{float: left; width: 100%; margin-top: 23px;} #obtn .pageHotNews li a{float: left; width: 100%;} #obtn .pageHotNews li h4{float: left; width: 100%; color:#444444; font-size: 16px; line-height: 28px;max-height:56px; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .pageHotNews li a:hover h4{color:#58d398} #obtn .pageHotNews li .p1{float: left; width: 100%; color:#919191; font-size: 14px; line-height: 32px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #obtn .pageHotNews li .labelSpan{float: left; width: 100%; margin-top: 11px; line-height: 24px; color:#b2b2b2; font-size: 12px;} #obtn .pageHotNews li .labelSpan img{vertical-align: middle; margin-top: -3px;} @media screen and (max-width:1023px) { #obtn .pageHotNews{width: 100%; margin-bottom: 40px;} #obtn .pageHotNews .newsH1{margin-top: 0; background: #f5f5f5; padding: 0 15px; line-height: 40px;} #obtn .pageHotNews ul{margin-top:0;} #obtn .pageHotNews li{width: 50%; padding-right: 1px;margin-top:2px;} #obtn .pageHotNews li h4{height: 56px;} #obtn .pageHotNews li a{background: #f5f5f5; padding: 15px;} #obtn .pageHotNews li:last-child{display: none;} } @media screen and (max-width:767px) { #obtn .pageHotNews{margin-bottom: 30px;} #obtn .pageHotNews li{width:100%; padding-right:0;} #obtn .pageHotNews li h4{height: auto;} } /*新闻内页*/ #obtn .pageNewsInfo{float: left; width: 71.25%; margin:40px 0 100px 0;} #obtn .pageNewsInfo .curLocation{float: left; width: 100%; color:#666666; font-size: 16px; line-height: 35px;} #obtn .pageNewsInfo .tH1{float: left; width: 100%; color:#444444; font-size: 28px; font-weight: bold; line-height: 40px; margin-top: 30px;} #obtn .pageNewsInfo .curLocLabel{float: left; width: 100%; color:#888888; font-size: 12px; line-height: 30px; margin-top: 16px;} #obtn .pageNewsInfo .curLocLabel span{display: inline-block; margin-right: 20px;} #obtn .pageNewsInfo .curLocLabel span img{vertical-align: middle; margin-top: -2px;} #obtn .pageNewsInfo .pageNewsText{float: left; width: 100%; margin-top: 23px; padding: 32px 0 60px 0; border-top:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; color:#444444; font-size: 16px; line-height: 32px;} #obtn .pageNewsInfo .pageFy{float: left; width: 100%; padding: 22px 0 33px 0; border-bottom: 1px solid #e6e6e6; position: relative} #obtn .pageNewsInfo .pageFy:after{position: absolute; content: ''; width: 1px; height: 70px; top:50%; margin-top: -35px; left: 50%; background: #e6e6e6} #obtn .pageNewsInfo .pageFy .leftFy{float: left; width: 50%; padding-right: 55px;} #obtn .pageNewsInfo .pageFy .rightFy{float: left; width: 50%; padding-left: 55px;} #obtn .pageNewsInfo .pageFy a{float: left; width: 100%; color: #58d498 !important; font-size: 16px; line-height: 40px;} #obtn .pageNewsInfo .pageNewsText h2{font-weight: 600;padding-top: 30px;} #obtn .pageNewsInfo .pageNewsText a{color: #58d498;} #obtn .pageNewsInfo .pageNewsText a:hover{color:#3bc48d;text-decoration: underline;} #obtn .pageNewsInfo .pageNewsText img {text-align: center !important;margin: 30px auto;display: block;width: auto !important;height: auto !important;border-radius: 10px;} #obtn .pageNewsInfo .pageNewsText p a{color: #58d498;} #obtn .pageNewsInfo .pageNewsText p a:hover{color:#3bc48d;text-decoration: underline;} #obtn .pageNewsInfo .pageNewsText p img {text-align: center !important;margin: 30px auto;display: block;width: auto !important;height: auto !important;} #obtn .pageNewsInfo .pageFy a:hover{color:#3bc48d;text-decoration: underline;} #obtn .pageNewsInfo .pageFy a span{float: left; width: 100%; line-height: 24px;} #obtn .pageNewsInfo .pageFy a b{float: left; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #obtn .pageNewsInfo .pageFy a span img{vertical-align: middle; margin-top: -2px;} #obtn .pageNewsInfo .pageFy .rightFy a span{text-align: right;} #obtn .pageNewsInfo .pageFy .rightFy a b{text-align: right;} @media screen and (max-width:1229px) { #obtn .pageNewsInfo{margin: 40px 0 70px 0;} #obtn .pageNewsInfo .pageNewsText{padding: 32px 0 40px 0;} #obtn .pageNewsInfo .pageFy{padding: 20px 0 25px 0;} } @media screen and (max-width:1023px) { #obtn .pageNewsInfo{width: 100%;margin: 30px 0 40px 0;} #obtn .pageNewsInfo .tH1{font-size: 26px; margin-top: 20px;} #obtn .pageNewsInfo .curLocLabel{margin-top: 10px;} #obtn .pageNewsInfo .pageNewsText{margin-top: 15px;padding: 25px 0 30px 0; font-size: 15px;line-height: 28px;} #obtn .pageNewsInfo .pageFy{padding: 15px 0 20px 0;} #obtn .pageNewsInfo .pageFy a{font-size: 14px; line-height: 30px;} #obtn .pageNewsInfo .pageFy:after{ height: 50px; margin-top: -25px;} } @media screen and (max-width:767px) { #obtn .pageNewsInfo{margin: 20px 0 30px 0;} #obtn .pageNewsInfo .curLocation{font-size: 15px;} #obtn .pageNewsInfo .tH1{font-size: 22px; line-height: 32px;} #obtn .pageNewsInfo .pageNewsText{margin-top: 10px; padding: 20px 0 25px 0; font-size: 14px; line-height: 24px;} #obtn .pageNewsInfo .pageFy .leftFy{padding-right: 10px;} #obtn .pageNewsInfo .pageFy .rightFy{padding-left: 10px;} } /*智能会展*/ #obtn .CloudServices{float: left; width: 100%; margin: 50px 0 85px 0;} #obtn .CloudTit{float: left; width: 100%; padding:0 38%; margin-top: 14px;} #obtn .CloudTit .li1{float: left; width: 100%; color:#444444; font-size: 20px; line-height: 40px; text-align: center; position: relative; cursor: pointer} #obtn .CloudTit .li1:after{position: absolute; content: ''; width: 74px; height:0; background: #2cac79; left: 50%; margin-left: -37px; bottom: 2px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .CloudTit .slick-slide.slick-current.slick-active .li1:after, #obtn .CloudTit .li1:hover:after{height: 3px;} #obtn .CloudList{float: left; width: 100%; margin-top: 45px;} #obtn .CloudList .liBox{float: left; width: 100%; background: #fff;} #obtn .CloudList .liBox .lImg{float: left; width: 19.25%; height: 545px;} #obtn .CloudList .liBox .lImg .hTit{float: right; width: 78%; margin-top: 42px; height: 150px; padding: 22px 34px 0 0; line-height: 45px; color:#fff; font-size: 20px; position:relative;text-align: right; } #obtn .CloudList .liBox .lImg .hTit span{position: relative; z-index: 2;} #obtn .CloudList .liBox .lImg .hTit:after{position: absolute; content: ''; width: 100%; height: 100%; opacity: 0.87;filter:alpha(opacity=87); right: 0; top:0; background: #3b45ae; background: -webkit-linear-gradient(left,#3b45ae,#34abe1); background: -o-linear-gradient(left,#3b45ae,#34abe1); background: -moz-linear-gradient(left,#3b45ae,#34abe1); background: -ms-linear-gradient(left,#3b45ae,#34abe1); background: linear-gradient(left,#3b45ae,#34abe1); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#3b45ae), color-stop(100%,#34abe1)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b45ae', endColorstr='#34abe1',GradientType=0 ); } #obtn .CloudList .liBox .rightSerList{float: left; width:80.75%;} #obtn .CloudList .liBox .rightSerList dl{float: left; width: 46.4%; height: 545px;position: relative} #obtn .CloudList .liBox .rightSerList dl:after{position: absolute; content: ''; width: 1px; height:76%; right: 0; top:12%; background: #e3e3e3;} #obtn .CloudList .liBox .rightSerList dl h3{float: left; width: 100%; padding: 0 30px 4px 30px; margin-top: 69px; color:#444444; font-size: 20px; line-height: 35px; position: relative} #obtn .CloudList .liBox .rightSerList dl h3:after{position: absolute; content: ''; width: 30px; height: 2px; bottom: 0; left: 30px; background: #585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(left,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0 ); } #obtn .CloudList .liBox .rightSerList dl .ddBox{float: left; width: 100%;} #obtn .CloudList .liBox .rightSerList dl .ddBox dd{float: left; width: 33.333%; text-align: center; margin: 48px 0 16px 0; cursor: pointer;} #obtn .CloudList .liBox .rightSerList dl .ddBox dd .tIco{float: left; width: 100%; text-align:center; line-height: 0;} #obtn .CloudList .liBox .rightSerList dl .ddBox dd .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .CloudList .liBox .rightSerList dl .ddBox dd .h1{float: left; width: 100%; margin-top: 5px; color:#444444; font-size: 16px; line-height: 40px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .CloudList .liBox .rightSerList dl .ddBox dd:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .CloudList .liBox .rightSerList dl .ddBox dd:hover .h1{color:#58d498;} #obtn .CloudList .liBox .rightSerList dl.two{width: 33.5%;} #obtn .CloudList .liBox .rightSerList dl.two .ddBox dd{width: 50%;} #obtn .CloudList .liBox .rightSerList dl.three{width: 20.1%;} #obtn .CloudList .liBox .rightSerList dl.three .ddBox dd{width:100%;} #obtn .CloudList .liBox .rightSerList dl.three:after{width: 0;} #obtn .CloudList .slick-dots{height: 6px;} #obtn .CloudList .slick-dots li{width: 32px; height: 6px; margin: 0 10px; background: #797c81} #obtn .CloudList .slick-dots li.slick-active{background: #11a142;} @media screen and (max-width:1229px) { #obtn .CloudTit .li1{font-size: 20px;} #obtn .CloudList .liBox .lImg .hTit{font-size: 24px;} #obtn .CloudList .liBox .rightSerList dl h3{font-size: 24px; padding: 0 20px 4px 20px} #obtn .CloudList .liBox .rightSerList dl h3:after{left: 20px;} #obtn .CloudList .liBox .rightSerList dl .ddBox dd .tIco img{width: 55px;} #obtn .CloudList .liBox .rightSerList dl .ddBox dd .h1{font-size: 18px;} } @media screen and (max-width:1023px) { #obtn .CloudTit{ padding:0 35%;} #obtn .CloudList{margin-top: 35px;} #obtn .CloudList .liBox .lImg{width: 100%; height:130px;} #obtn .CloudList .liBox .lImg .hTit{height: 100px; margin-top: 30px;} #obtn .CloudList .liBox .rightSerList{width: 100%; } #obtn .CloudList .liBox .rightSerList dl{height: 460px;} #obtn .CloudList .liBox .rightSerList dl h3{margin-top: 50px;} } @media screen and (max-width:767px) { #obtn .CloudServices{margin: 35px 0 60px 0;} #obtn .CloudTit{padding: 0;} #obtn .CloudTit .li1{font-size: 18px;} #obtn .CloudList{margin-top: 25px;} #obtn .CloudList .liBox .lImg{height: 100px;} #obtn .CloudList .liBox .lImg .hTit{height: 70px; font-size: 20px; padding: 15px 20px 0 0; line-height: 30px;} #obtn .CloudList .liBox .rightSerList{height: 710px; background: #fff;} #obtn .CloudList .liBox .rightSerList dl{width: 100%; height:auto;} #obtn .CloudList .liBox .rightSerList dl:after{width: 100%; height:1px; bottom: 0; left: 0;top: auto;} #obtn .CloudList .liBox .rightSerList dl h3{padding: 0 15px; margin-top: 20px;} #obtn .CloudList .liBox .rightSerList dl .ddBox{margin: 5px 0 10px 0;} #obtn .CloudList .liBox .rightSerList dl .ddBox dd{margin:10px 0} #obtn .CloudList .liBox .rightSerList dl .ddBox dd .tIco img{width: 45px;} #obtn .CloudList .liBox .rightSerList dl .ddBox dd .h1{font-size: 16px; line-height: 30px; margin-top: 5px;} #obtn .CloudList .liBox .rightSerList dl.two{width: 100%;} #obtn .CloudList .liBox .rightSerList dl.two .ddBox dd{width: 33.3333%;} #obtn .CloudList .liBox .rightSerList dl.three{width: 100%;} #obtn .CloudList .liBox .rightSerList dl.three .ddBox dd{width: 33.3333%;} #obtn .CloudList .slick-dots{height: 4px; bottom: -15px;} #obtn .CloudList .slick-dots li{height: 4px;} } @media screen and (max-width:413px) { #obtn .solSecBox .trafficBox.Exhibition li .dText{height: 48px;} } #obtn .reservationBox{float: left; width: 100%; margin: 50px 0 68px 0;} #obtn .reservRightImg{float: left; width: 55%; line-height: 0; margin-top: 20px;} #obtn .reservLeftText{float: left; width: 45%; margin-top: 60px;} #obtn .reservLeftText dl{float: left; width: 100%; padding-left: 100px; margin-top: 30px; position: relative; cursor: pointer} #obtn .reservLeftText dl span{position: absolute; content:''; width: 60px; height: 60px; left: 20px;} #obtn .reservLeftText dl span img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .reservLeftText dl:hover span img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .reservLeftText dl h3{float: left; width: 100%; color:#444444; font-size: 18px; line-height: 35px;} #obtn .reservLeftText dl .p1{float: left; width: 100%; color:#656565; font-size: 15px; line-height: 30px;} @media screen and (max-width:1229px) { #obtn .reservLeftText{margin-top: 30px;} } @media screen and (max-width:1023px) { #obtn .reservationBox{margin: 45px 0 50px 0;} #obtn .reservLeftText{width: 100%;} #obtn .reservRightImg{width: 100%;} } @media screen and (max-width:767px) { #obtn .reservationBox{margin: 35px 0 40px 0;} #obtn .reservLeftText{margin-top: 10px;} #obtn .reservLeftText dl{margin-top: 15px; padding-left: 60px;} #obtn .reservLeftText dl span{width: 45px; height: 45px; left:0;} #obtn .reservLeftText dl h3{font-size: 20px;} #obtn .reservLeftText dl .p1{font-size: 15px; line-height: 28px;} } #obtn .platformBox{float: left; width: 100%; position: relative; background:#3c41ab; background: -webkit-linear-gradient(left,#35a9e1,#0b1529); background: -o-linear-gradient(left,#35a9e1,#0b1529); background: -moz-linear-gradient(left,#35a9e1,#0b1529); background: -ms-linear-gradient(left,#35a9e1,#0b1529); background: linear-gradient(left,#35a9e1,#0b1529); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#35a9e1), color-stop(100%,#0b1529)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#35a9e1', endColorstr='#0b1529',GradientType=0 ); } #obtn .platformBg{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity: 0.18;filter:alpha(opacity=18);} #obtn .platformInfo{float: left; width: 100%; position:relative; z-index: 2; margin: 50px 0 60px 0;} #obtn .platformInfo .pageTit{color:#fff;} #obtn .platformInfo .textBox{float: left; width: 100%; text-align: center; color:#fff; font-size:15px; line-height: 24px; margin-top: 22px;} #obtn .platformList{float: left; width: 100%; margin-top: 3px;} #obtn .platformList ul{margin: 0 -20px;} #obtn .platformList li{float: left; width: 50%; padding: 0 20px; margin-top: 25px;} #obtn .platformList li .platWords{float: left; width: 100%; background: #fff; border:1px solid #e6e9f0; padding-bottom: 50px; height: 285px; cursor: pointer; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .platformList li .platWords .tIco{float: left; width: 100%; margin-top: 33px; line-height: 0; text-align: center;} #obtn .platformList li .platWords .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .platformList li .platWords:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .platformList li .platWords h3{float: left; width: 100%; text-align: center; color:#444444; font-size: 20px; line-height: 45px; padding-bottom: 8px; position: relative} #obtn .platformList li .platWords h3:after {position: absolute;content: '';width: 30px;height: 2px;left: 50%;margin-left: -15px;bottom: 0; background: #585f75; background: -webkit-linear-gradient(top,#b9bfce,#585f75); background: -o-linear-gradient(top,#b9bfce,#585f75); background: -moz-linear-gradient(top,#b9bfce,#585f75); background: -ms-linear-gradient(top,#b9bfce,#585f75); background: linear-gradient(to bottom,#b9bfce,#585f75); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b9bfce), color-stop(100%,#585f75)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .platformList li .platWords dl{float: left; width: 100%; margin-top: 8px;} #obtn .platformList li .platWords dl dd{float: left; width: 33.333%; text-align: center; margin-top: 10px; color:#656565; font-size: 15px; line-height: 30px;} #obtn .platformList li .platWords dl.two dd{width: 100%; padding: 0 50px;} #obtn .platformList li .platWords:hover{ background:#fff; background: rgba(255,255,255,0.93); box-shadow: 0 0 15px rgba(13,13,13,0.3); -moz-box-shadow: 0 0 15px rgba(13,13,13,0.3); -webkit-box-shadow: 0 0 15px rgba(13,13,13,0.3); } @media screen and (max-width:1229px) { #obtn .platformList ul{margin: 0 -13px;} #obtn .platformList li{padding: 0 13px;} } @media screen and (max-width:1023px) { #obtn .platformInfo .textBox{margin-top: 15px; font-size: 15px;} #obtn .platformList ul{margin: 0 -10px;} #obtn .platformList li{margin-top: 20px; padding: 0 10px;} #obtn .platformList li .platWords .tIco{margin-top: 25px;} #obtn .platformList li .platWords h3{font-size: 20px; line-height: 40px;} #obtn .platformList li .platWords dl dd{font-size: 15px; width: 50%; margin-top:5px;} #obtn .platformList li .platWords dl.two dd{font-size: 15px; padding: 0 25px;} } @media screen and (max-width:767px) { #obtn .platformInfo{margin: 35px 0 40px 0} #obtn .platformInfo .textBox{font-size: 14px; margin-top: 10px;} #obtn .platformList li{width: 100%; margin-top: 15px;} #obtn .platformList li .platWords{height: auto;padding-bottom:30px;} #obtn .platformList li .platWords .tIco{margin-top: 20px;} #obtn .platformList li .platWords dl dd{font-size: 14px; line-height: 26px; margin-top: 0;} #obtn .platformList li .platWords dl.two dd{font-size: 14px; line-height: 26px;} } #obtn .iBanner.newBanner .box{opacity: 1;} #obtn .newTop{float: right; margin-top: 40px;} #obtn .newTop .newSearch{float: left; width: 215px; height: 34px; border:1px solid #d9d9d9; padding-right: 40px; position: relative; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .newTop .newSearch input{float: left; width: 100%; height: 32px; background: #fff; border:0; text-indent: 12px; font-size: 14px; line-height: 32px; color:#333; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .newTop .newSearch button{position: absolute; border:0; background: none; right: 12px; top:50%; margin-top: -9px;} #obtn .newTop .sortBox{float: left; margin-left: 30px;} #obtn .newTop .sortBox span{float: left; height: 34px; border:1px solid #d9d9d9; line-height: 32px; color:#444444; font-size: 14px; padding: 0 12px; cursor: pointer; border-radius: 4px 0 0 4px; -moz-border-radius: 4px 0 0 4px; -webkit-border-radius: 4px 0 0 4px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .newTop .sortBox span:last-child{margin-left: -1px; border-radius: 0 4px 4px 0; -moz-border-radius: 0 4px 4px 0; -webkit-border-radius: 0 4px 4px 0; } #obtn .newTop .sortBox span.on, #obtn .newTop .sortBox span:hover{color:#58d398;border-color:#58d398;position: relative; z-index: 2;} @media screen and (max-width:1024px) { #obtn .pz_SideLayerNews1{ margin-top:12px;} #obtn .newTop{ width:100%; margin-top:20px;} } @media screen and (max-width:767px) { #obtn .newTop{margin-top: 20px;} #obtn .newTop .newSearch{width: 100%;} #obtn .newTop .sortBox{margin-left: 0; margin-top: 10px;} } #obtn .newsVideoList{float: left; width: 100%; margin: 6px 0 120px 0;} #obtn .newsVideoList ul{margin: 0 -15px;} #obtn .newsVideoList li{float: left; width:33.333%; margin-top: 34px; padding: 0 15px;height: 300px;} #obtn .newsVideoList li a{float: left; width: 100%; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .newsVideoList li a:hover{ box-shadow: 0 0 24px rgba(118,124,131,0.3); -moz-box-shadow: 0 0 24px rgba(118,124,131,0.3); -webkit-box-shadow: 0 0 24px rgba(118,124,131,0.3); } #obtn .newsVideoList li a .tImg{float: left; width: 100%; line-height: 0; overflow: hidden; background:#000; position: relative} #obtn .newsVideoList li a .tImg img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .newsVideoList li a:hover .tImg img{ opacity: 0.6;filter:alpha(opacity=60); } #obtn .newsVideoList li a .tImg em{position: absolute; z-index: 3; line-height: 0; width: 37px; height: 37px; left: 50%; margin-left: -19px; top:50%; margin-top: -19px;} #obtn .newsVideoList li a .tImg em img{opacity: 0;filter:alpha(opacity=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .newsVideoList li a:hover .tImg em img{opacity:1;filter:alpha(opacity=100);} #obtn .newsVideoList li a .dText{float: left; width: 100%; background: #fafafa; padding: 0 29px 25px 29px;} #obtn .newsVideoList li a .dText h3{float: left; width: 100%; color:#444444; font-size: 18px; line-height: 30px; margin-top: 18px; overflow: hidden; /**text-overflow:ellipsis; white-space: nowrap;**/ } #obtn .newsVideoList li a .dText .time{float: left; width: 100%; margin-top: 7px; color:#888888; font-size: 14px; line-height: 30px;} #obtn .newsVideoList li a .dText .time span{display: inline-block; margin-right: 30px;} #obtn .newsVideoList li a .dText .time img{vertical-align: middle; margin-top: -2px;} @media screen and (max-width:1229px) { #obtn .newsVideoList{margin-bottom: 80px;} #obtn .newsVideoList li a .dText {padding: 0 15px 20px 15px} #obtn .newsVideoList li a .dText h3{font-size: 16px; margin-top: 15px;} #obtn .newsVideoList li a .dText .time span{margin-right: 20px;} } @media screen and (max-width:1023px) { #obtn .newsVideoList{margin-bottom:50px;} #obtn .newsVideoList ul{margin: 0 -10px;} #obtn .newsVideoList li{margin-top: 25px; padding: 0 10px;} #obtn .newsVideoList li a .dText {padding: 0 10px 15px 10px} #obtn .newsVideoList li a .dText h3{margin-top: 10px;} #obtn .newsVideoList li a .dText .time span{margin-right: 10px; font-size: 12px;} } @media screen and (max-width:767px) { #obtn .newsVideoList{margin-bottom:30px;} #obtn .newsVideoList ul{margin: 0 -6px;} #obtn .newsVideoList li{margin-top: 15px; width: 50%; padding: 0 6px;} #obtn .newsVideoList li a .dText{padding: 0 10px 10px 10px} #obtn .newsVideoList li a .dText .time span{float:left;line-height: 24px;} } /*产品定价-地图制作*/ #obtn .iBanner.proBanner{background: #17344b;} #obtn .iBanner.proBanner .box{opacity: 1;filter:alpha(opacity=100);} #obtn .iBanner.proBanner .box img{opacity: 0.3;filter:alpha(opacity=30); position: relative; z-index: 1;} #obtn .iBanner.proBanner .proWords{position: absolute; z-index: 5; width: 100%; left: 0; top:50%; margin-top: -174px;} #obtn .iBanner.proBanner .proWords .h1{float: left; width: 100%; text-align: center; display:block;} #obtn .iBanner.proBanner .proWords .h1 span{display: inline-block; width: 248px; height: 58px; line-height: 56px; color:#fff; font-size: 24px; background: #3735fa; border-radius: 35px; -moz-border-radius: 35px; -webkit-border-radius: 35px; } #obtn .iBanner.proBanner .proWords h1{float: left; width: 100%; text-align: center; color:#fff; font-size: 32px; font-weight: bold; line-height: 60px; margin-top: 34px;} #obtn .iBanner.proBanner .proWords dl{float: left; width: 100%; padding: 0 25%;} #obtn .iBanner.proBanner .proWords dl dd{float: left; width: 50%; color:#ffffff; font-size: 16px; line-height: 33px; font-weight: 100; margin-top: 25px; text-align: center;} #obtn .iBanner.proBanner .proWords dl dd:last-child{ letter-spacing:.06em;} #obtn .iBanner.proBanner .proWords dl dd img{vertical-align: middle; margin-top: -2px;} @media screen and (max-width:1399px) { #obtn .iBanner.proBanner .proWords{margin-top: -155px;} #obtn .iBanner.proBanner .proWords .h1 span{font-size: 22px; height: 50px; line-height: 50px;} #obtn .iBanner.proBanner .proWords h1{font-size: 38px; line-height: 50px; margin-top:25px;} #obtn .iBanner.proBanner .proWords dl{padding: 0 20%; margin-top: 10px;} #obtn .iBanner.proBanner .proWords dl dd{margin-top: 15px; font-size: 16px;} } @media screen and (max-width:1229px) { #obtn .iBanner.proBanner .proWords{margin-top: -130px;} #obtn .iBanner.proBanner .proWords .h1 span{font-size: 20px; height: 40px; line-height: 40px;} #obtn .iBanner.proBanner .proWords h1{font-size: 32px; line-height: 40px; margin-top:15px;} #obtn .iBanner.proBanner .proWords dl{padding: 0 20%; margin-top: 10px; line-height: 26px;} #obtn .iBanner.proBanner .proWords dl dd{margin-top: 10px; font-size: 16px;} } @media screen and (max-width:1023px) { #obtn .iBanner.proBanner .proWords{margin-top: -95px;} #obtn .iBanner.proBanner .proWords dl{padding: 0 15%;} } @media screen and (max-width:767px) { #obtn .iBanner.proBanner .proWords{margin-top: -70px;} #obtn .iBanner.proBanner .proWords .h1 span{font-size: 16px; height: 30px; line-height: 30px; width: 180px;} #obtn .iBanner.proBanner .proWords h1{font-size:24px; line-height: 30px; margin-top:10px;} #obtn .iBanner.proBanner .proWords dl{padding: 0 10px; margin-top: 10px; line-height: 20px;} #obtn .iBanner.proBanner .proWords dl dd{margin-top: 10px; font-size: 12px;line-height: 20px;} #obtn .iBanner.proBanner .proWords dl dd img{width: 10px; height: 10px;} } @media screen and (max-width:375px) { #obtn .iBanner.proBanner .proWords dl{padding: 0;} #obtn .iBanner.proBanner .proWords dl dd{ text-align:left;} } #obtn .proSecond{float: left; width: 100%; margin-top: -70px; position: relative; z-index: 999; background:#fff; background: rgba(255,255,255,0.05);border-top:1px solid #fff; border-top:1px solid rgba(255,255,255,0.12);} #obtn .proSecond li{float: left; width: 50%;} #obtn .proSecond li a{float: left; width: 100%; line-height: 69px; text-align: center; color:#fff; color:rgba(255,255,255,0.5); font-size: 18px;} #obtn .proSecond li a.on, #obtn .proSecond li a:hover{color:#fff; font-weight: bold; background: #fff; background: rgba(255,255,255,0.2);} @media screen and (max-width:1229px) { #obtn .proSecond{margin-top: -60px;} #obtn .proSecond li a{line-height: 59px; font-size: 18px;} } @media screen and (max-width:1023px) { #obtn .proSecond{margin-top:0;position: relative; z-index: 1;background:#3735fa; background: rgba(55,53,250,0.9);} #obtn .proSecond li a{color:#fff;} } @media screen and (max-width:767px) { #obtn .proSecond li a{line-height: 45px; font-size: 16px;} } #obtn .proBg1{float: left; width: 100%; background: #fbfbfd;} #obtn .proTableBox{float: left; width: 100%; margin: 70px 0 100px 0;} #obtn .proTableBox .proDt{float: left; width: 14.9%; border:1px solid #e5e5e5; border-bottom: 0;} #obtn .proTableBox .proDt .dd{float: left; width: 100%; border-bottom: 1px solid #e5e5e5; display: table; background: #fff;} #obtn .proTableBox .proDt .dd.first{height: 156.5px; background: #f5f7fa;} #obtn .proTableBox .proDt .dd span{ display: table-cell; vertical-align: middle; width:100%; text-align:center; color:#444444; font-size: 15px; line-height: 30px;} #obtn .proTableBox .proDt .dd.two{height: 402px;} #obtn .proTableBox .proDt .dd.three{height:69px;} #obtn .proTableBox .proDt .dd.four{height:140px;} #obtn .proTableBox .proDl{float: left; width: 28.36666%; border-right:1px solid #e5e5e5; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .proTableBox .proDl:hover{ position: relative; z-index: 2; box-shadow: 0 0 15px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 15px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.2); } #obtn .proTableBox .proDl .dd{float: left; width: 100%; display: table; background: #fff; border-bottom: 1px solid #e5e5e5; height: 69px;} #obtn .proTableBox .proDl .dd.first{background: #f5f7fa;height: 158px; text-align: center; border-top:4px solid #37a1ff;} #obtn .proTableBox .proDl .dd.first .table{display: table-cell; vertical-align: middle;} #obtn .proTableBox .proDl .dd.first .table span{float: left; width: 100%; color:#444444; font-size: 20px; line-height:40px;} #obtn .proTableBox .proDl .dd.first .table em{float: left; width: 100%; margin-top: 10px; display: block; text-align: center;} #obtn .proTableBox .proDl .dd.first .table em a{display: inline-block; width: 130px; height: 40px; line-height: 40px; color:#fff; font-size: 16px; border-radius: 25px; -moz-border-radius: 25px; -webkit-border-radius: 25px; background:#417cff; background: -webkit-linear-gradient(left,#417cff,#34aeff); background: -o-linear-gradient(left,#417cff,#34aeff); background: -moz-linear-gradient(left,#417cff,#34aeff); background: -ms-linear-gradient(left,#417cff,#34aeff); background: linear-gradient(to right,#417cff,#34aeff); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#417cff), color-stop(100%,#34aeff)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#34aeff',GradientType=0); } #obtn .proTableBox .proDl .dd .table{display: table-cell; vertical-align: middle; color:#777777; font-size: 15px; line-height: 28px;text-align: center;} #obtn .proTableBox .proDl .dd.two{height: 97px;} #obtn .proTableBox .proDl .dd.three{height: 97px;} #obtn .proTableBox .proDl.two .dd.first{border-top:4px solid #2e85ff;} #obtn .proTableBox .proDl.two .dd.first .table em a{ background:#3462ff; background: -webkit-linear-gradient(left,#3462ff,#29a3ff); background: -o-linear-gradient(left,#3462ff,#29a3ff); background: -moz-linear-gradient(left,#3462ff,#29a3ff); background: -ms-linear-gradient(left,#3462ff,#29a3ff); background: linear-gradient(to right,#3462ff,#29a3ff); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#3462ff), color-stop(100%,#29a3ff)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3462ff', endColorstr='#29a3ff',GradientType=0); } #obtn .proTableBox .proDl.two .dd span{color:#fb881b} #obtn .proTableBox .proDl.three .dd.first{border-top:4px solid #fb9321;} #obtn .proTableBox .proDl.three .dd.first .table em a{ background:#fb8116; background: -webkit-linear-gradient(left,#fb8116,#fca72d); background: -o-linear-gradient(left,#fb8116,#fca72d); background: -moz-linear-gradient(left,#fb8116,#fca72d); background: -ms-linear-gradient(left,#fb8116,#fca72d); background: linear-gradient(to right,#fb8116,#fca72d); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#fb8116), color-stop(100%,#fca72d)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fb8116', endColorstr='#fca72d',GradientType=0); } #obtn .proTableBox .proDl.three .dd span{color:#fb881b} #obtn .proTableBox .dlDown{float: left; width:56.73332%; display: table; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;height: 140px; background: #fff; padding: 0 40px;} #obtn .proTableBox .dlDown .table{display: table-cell; vertical-align: middle; color:#777777; font-size: 16px; line-height: 30px;} #obtn .proTableBox .dlDown.rightDd{text-align: center; width: 28.36666%;} #obtn .proTableBox .proDl .last{display: none; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;height: 140px; background:#fff;} #obtn .proTableBox .proDt.phoneN{display: none;} @media screen and (max-width:1229px) { #obtn .proTableBox{margin: 60px 0 80px 0;} } @media screen and (max-width:1023px) { #obtn .proTableBox{margin: 50px 0 60px 0} #obtn .proTableBox .proDt .dd span{font-size: 14px;} #obtn .proTableBox .proDl .dd.first .table span{font-size: 18px;} #obtn .proTableBox .proDl .dd.first .table em a{width: 140px; height: 40px; line-height: 40px; font-size: 16px;} #obtn .proTableBox .proDl .dd .table{font-size: 14px;} #obtn .proTableBox .dlDown .table{font-size: 14px;} } @media screen and (max-width:767px) { #obtn .proTableBox{margin:25px 0 40px 0;} #obtn .proTableBox .xxx{width: 100%;overflow: hidden;} #obtn .proTableBox .proDt.phoneN{display: block;} #obtn .proTableBox .proDt{width: 30%; margin-top: 15px;} #obtn .proTableBox .proDl{width: 70%;margin-top: 15px;} #obtn .proTableBox .proDl .last{display: table; text-align: left; padding: 0 10px;} #obtn .proTableBox .proDl .last .table{text-align: left; line-height: 24px;} #obtn .proTableBox .dlDown{display: none;} #obtn .proTableBox .proDl.three .last .table{text-align: center;} } #obtn .enterpriseBox{float: left; width: 100%; margin: 90px 0 100px 0;} #obtn .enterpriseList{float:left; width: 100%; padding: 0 24px;} #obtn .enterpriseList .ulBox1{float: left; width: 100%;} #obtn .enterpriseList .ulBox1 li{float: left; width:20%; margin-top: 32px; padding: 0 13px; height: 100px; text-align: center; line-height: 100px; overflow: hidden;} #obtn .enterpriseList .ulBox1 li img{vertical-align: middle; margin-top: -3px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .enterpriseList .ulBox1 li:hover img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .enterpriseList .slick-prev, #obtn .enterpriseList .slick-next{width: 34px; height: 34px; left: -34px; background: url("_im_g/pro1.png") no-repeat; border-radius: 27px; -moz-border-radius: 27px; -webkit-border-radius: 27px; } #obtn .enterpriseList .slick-next{left: auto; right: -34px; background: url("_im_g/pro2.png") no-repeat;} #obtn .enterpriseList .slick-prev:hover, #obtn .enterpriseList .slick-next:hover{ box-shadow: 0 0 10px rgba(0,0,0,0.3); } @media screen and (max-width:1229px) { #obtn .enterpriseBox{margin: 70px 0 80px 0;} } @media screen and (max-width:1023px) { #obtn .enterpriseBox{margin:50px 0 65px 0;} #obtn .enterpriseList .ulBox1 li{margin-top: 20px; height: 70px; line-height: 70px;} } @media screen and (max-width:767px) { #obtn .enterpriseBox{margin:35px 0 40px 0;} #obtn .enterpriseList .ulBox1{margin-top: 10px;} #obtn .enterpriseList .ulBox1 li{width:33.3333%; padding:0 7px;height: 60px; line-height: 60px; margin-top: 10px;} #obtn .enterpriseList .ulBox1 li:last-child{display: none;} #obtn .enterpriseList .slick-prev, #obtn .enterpriseList .slick-next{left: -10px; } #obtn .enterpriseList .slick-next{left: auto; right: -10px;} } /*关于我们*/ #obtn .iBanner.aboutBanner{background: #113697} #obtn .iBanner.aboutBanner .box{opacity: 0.2;filter:alpha(opacity=20);} #obtn .iBanner.aboutBanner .aboutBanText{position: absolute; width: 100%; text-align: center; color:#ffffff; font-size: 40px; line-height: 60px; top:50%; margin-top: -63px;} #obtn .btn_ico{ display: block; width: 100%; text-align: center; height: 36px; margin-top:30px; -webkit-animation: mouse-dot 1.5s cubic-bezier(0.23, 1, 0.32, 1) infinite; animation: mouse-dot 1.5s cubic-bezier(0.23, 1, 0.32, 1) infinite;} @keyframes mouse-dot { from { opacity: 0; } 33% { opacity: 1; } to { transform: translateY(20px); -webkit-transform: translateY(20px); opacity: 0; } } @-webkit-keyframes mouse-dot { from { opacity: 0; } 33% { opacity: 1; } to { transform: translateY(20px); -webkit-transform: translateY(20px); opacity: 0; } } @-moz-keyframes mouse-dot { from { opacity: 0; } 33% { opacity: 1; } to { transform: translateY(20px); -webkit-transform: translateY(20px); opacity: 0; } } @-o-keyframes mouse-dot { from { opacity: 0; } 33% { opacity: 1; } to { transform: translateY(20px); -webkit-transform: translateY(20px); opacity: 0; } } @media screen and (max-width:1229px) { #obtn .iBanner.aboutBanner .aboutBanText{font-size: 42px; line-height: 50px; top:50%; margin-top: -53px;} #obtn .btn_ico{margin-top:20px;} } @media screen and (max-width:1023px) { #obtn .iBanner.aboutBanner .aboutBanText{font-size: 36px; line-height: 45px; margin-top: -48px;} #obtn .btn_ico{margin-top:15px;} } @media screen and (max-width:767px) { #obtn .iBanner.aboutBanner .aboutBanText{font-size: 28px; line-height: 35px; margin-top: -35px;} #obtn .btn_ico{margin-top:10px; height: 25px;} #obtn .btn_ico img{width: 25px; height: 25px;} } #obtn .slideBox.aboutSlide{background: #f5f7fb} #obtn .aboutCompany{float: left; width: 100%; background: #fff; position: relative;} #obtn .aboutComBg{position: absolute; width: 100%; height: 100%; left: 0; top:0;} #obtn .aboutCompanyInfo{float: left; width: 100%; margin: 140px 0 180px 0; position: relative; z-index: 2;} #obtn .aboutCompanyInfo .textBox{float: left; width: 100%; color:#444444; font-size: 15px; line-height: 34px;} #obtn .aboutCompanyInfo .aboutComList{float: left; width: 100%; margin-top: 60px;} #obtn .aboutCompanyInfo .aboutComList ul{margin: 0 -10px;} #obtn .aboutCompanyInfo .aboutComList li{float: left; width: 25%; padding: 0 10px;} #obtn .aboutCompanyInfo .aboutComList li .liBox{float: left; width: 100%; background: #fff; padding: 33px 0 25px 0; cursor: pointer; box-shadow: 0 0 20px rgba(219,224,229,0.66); -moz-box-shadow: 0 0 20px rgba(219,224,229,0.66); -webkit-box-shadow: 0 0 20px rgba(219,224,229,0.66); border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .aboutCompanyInfo .aboutComList li .liBox:hover{ box-shadow: 0 0 20px rgba(0,217,173,0.3); -moz-box-shadow: 0 0 20px rgba(0,217,173,0.3); -webkit-box-shadow: 0 0 20px rgba(0,217,173,0.3); } #obtn .aboutCompanyInfo .aboutComList li .liBox .mi{float: left; width: 100%; text-align: center; color:#00d4b2; font-size: 40px; font-weight: bold; line-height: 50px;} #obtn .aboutCompanyInfo .aboutComList li .liBox .tit{float: left; width: 100%; text-align: center; color:#444444; font-size: 16px; line-height: 42px; font-weight: 600;} @media screen and (max-width:1229px) { #obtn .aboutCompanyInfo{ margin:100px 0 130px 0; } #obtn .aboutCompanyInfo .aboutComList{margin-top: 40px;} #obtn .aboutCompanyInfo .aboutComList li .liBox{padding: 25px 0;} #obtn .aboutCompanyInfo .aboutComList li .liBox .mi{font-size: 38px;} } @media screen and (max-width:1023px) { #obtn .aboutCompanyInfo{ margin:80px 0 100px 0; } #obtn .aboutCompanyInfo .textBox{font-size: 15px; line-height: 30px;} #obtn .aboutCompanyInfo .aboutComList li .liBox{padding: 15px 0;} #obtn .aboutCompanyInfo .aboutComList li .liBox .mi{font-size: 32px; line-height: 45px;} #obtn .aboutCompanyInfo .aboutComList li .liBox .tit{line-height: 35px;} } @media screen and (max-width:767px) { #obtn .aboutCompanyInfo{ margin:40px 0; } #obtn .aboutCompanyInfo .textBox{font-size: 14px; line-height: 26px;} #obtn .aboutCompanyInfo .aboutComList{margin-top: 15px;} #obtn .aboutCompanyInfo .aboutComList li{width: 50%;margin-top: 15px;} #obtn .aboutCompanyInfo .aboutComList li .liBox .mi{font-size: 28px; line-height: 40px;} #obtn .aboutCompanyInfo .aboutComList li .liBox .tit{font-size: 15px;} } #obtn .aboutHistoryBox{float: left; width: 100%; background: #252d48; position: relative} #obtn .aboutHistoryBg{position: absolute; width: 100%; height: 100%; left: 0; top:0; opacity: 0.1;filter:alpha(opacity=10);} #obtn .aboutHistoryInfo{float: left; width: 100%; position: relative; z-index: 2; margin: 87px 0 84px 0;} #obtn .aboutHistoryInfo .pageTit{color:#fff;} #obtn .aboutHistoryList{float: left;width: 100%; margin-top: 63px; position: relative;} #obtn .aboutHistoryList .hisIco{position: absolute; z-index: 9; width: 30px; height: 40px; line-height: 0; left: 0; bottom: 48px;} #obtn .aboutHisListBox{float: left; width: 100%;} #obtn .aboutHisListBox .liHis{float: left; width: 100%; position: relative; padding-bottom: 10px;} #obtn .aboutHisListBox .liHis:after{position: absolute; content: ''; width: 2px; height: 900px; background: #58d398; left: 50%; margin-left: -1px;} #obtn .aboutHisListBox .liHis .nyrBox{float: left; width: 100%; text-align: center; display: block; position: relative; z-index: 3; margin-bottom: 77px;} #obtn .aboutHisListBox .liHis .nyrBox:after{position: absolute; content: '';width: 0;height: 0; left: 50%; margin-left: -25px; bottom: -22px; border-left:25px solid transparent; border-right: 25px solid transparent; border-top: 22px solid #58d398; } #obtn .aboutHisListBox .liHis .nyrBox em{display: inline-block; color:#fff; font-size: 20px; width: 50px; background: #58d398; line-height: 30px; padding-top: 10px;} #obtn .aboutHisListBox .liHis dl{float: left; width: 100%; margin-top: -10px;position: relative} #obtn .aboutHisListBox .liHis dl:after{position: absolute; content: ''; width: 20px; height: 3px; background: #58d398; top:5px; left: 50%; margin-left: -10px;} #obtn .aboutHisListBox .liHis dl dd{float: right; width: 50%; padding-left: 47px;} #obtn .aboutHisListBox .liHis dl.two dd{float: left; padding: 0 47px 0 0;} #obtn .aboutHisListBox .liHis dl dd .table{float:left; width:340px;display: table; height: 70px; background: #fff; background:rgba(255,255,255,0.2); border:1px dotted #58d398; border-color:rgba(88,211,152,0.3); border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .aboutHisListBox .liHis dl.two dd .table{float: right;} #obtn .aboutHisListBox .liHis dl dd .table span{display: table-cell; vertical-align: middle; color:#ffffff; font-size: 15px; line-height: 28px; padding:0 30px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .aboutHisListBox .liHis dl.two dd .table span{text-align: right;} #obtn .aboutHisListBox .liHis dl dd .table:hover span{color:#58d498;} #obtn .aboutHisDate{float: left; width: 100%; margin-top: 65px; position: relative} #obtn .aboutHisDate:after{position: absolute; content: ''; width: 100%;border-top:1px solid #fff; border-color:rgba(255,255,255,0.4); top:11px;} /*#obtn .aboutHisDate .slick-list.draggable .slick-track{transform:translate3d(0px, 0px, 0px) !important;}*/ #obtn .aboutHisDate .dataBox{float: left; width: 100%; text-align: center; color:#fff; font-size: 22px; font-weight: 100; line-height: 35px; padding-top: 46px; position: relative; cursor: pointer;} #obtn .aboutHisDate .dataBox:after{position: absolute; content: ''; width: 22px; height: 22px; background: #fff; background: rgba(255,255,255,0.2); left: 50%; margin-left: -11px; top:0; border-radius: 13px; -moz-border-radius: 13px; -webkit-border-radius: 13px; } #obtn .aboutHisDate .dataBox:before{position: absolute; content: ''; width: 10px; height: 10px; background: #fff; background: rgba(255,255,255,0.4); left: 50%; margin-left: -5px; top:6px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #obtn .aboutHisDate .slick-slide.slick-current.slick-active .dataBox:after{background: #58d298; background: rgba(88,210,152,0.4);} #obtn .aboutHisDate .slick-slide.slick-current.slick-active .dataBox:before{background: #58d298;} #obtn .aboutHisDate .slick-next{width: 32px; height: 32px; background: url("_im_g/about4.png") no-repeat; right: 0; top:12px;} #obtn .aboutHisDate .slick-next:after{ box-shadow: 0 0 10px rgba(255,255,255,0.4); -moz-box-shadow: 0 0 10px rgba(255,255,255,0.4); -webkit-box-shadow: 0 0 10px rgba(255,255,255,0.4); } @media screen and (max-width:1229px) { #obtn .aboutHistoryInfo{margin: 80px 0;} #obtn .aboutHistoryList{margin-top: 50px;} #obtn .aboutHisListBox .liHis{padding-bottom: 110px;} #obtn .aboutHisDate{margin-top: 55px;} #obtn .aboutHisDate .slick-list.draggable{padding:0!important;} } @media screen and (max-width:1023px) { #obtn .aboutHistoryInfo{margin: 60px 0;} #obtn .aboutHistoryList{margin-top: 35px;} #obtn .aboutHisListBox .liHis{padding-bottom: 80px;} #obtn .aboutHisListBox .liHis .nyrBox em{font-size: 18px;} #obtn .aboutHisListBox .liHis dl dd .table{width: 100%;} #obtn .aboutHisListBox .liHis dl dd .table span{font-size: 15px; line-height: 26px;padding: 0 15px;} #obtn .aboutHisDate .slick-list.draggable{padding:0 30px!important;} #obtn .aboutHisDate .dataBox{font-size: 20px; padding-top: 35px;} #obtn .aboutHistoryList .hisIco{bottom:35px;} } @media screen and (max-width:767px) { #obtn .aboutHistoryInfo{margin:30px 0 40px 0;} #obtn .aboutHistoryList{margin-top: 20px;} #obtn .aboutHisListBox .liHis{padding-bottom:30px;padding-left: 76px;} #obtn .aboutHisListBox .liHis:after{left:100px; margin-left:0;} #obtn .aboutHisListBox .liHis .nyrBox{margin-bottom: 25px; text-align: left;} #obtn .aboutHisListBox .liHis .nyrBox em{font-size: 16px; text-align:center; padding-top:4px;} #obtn .aboutHisListBox .liHis .nyrBox:after{left:0; margin-left:0;} #obtn .aboutHisListBox .liHis dl{margin-top: 15px;} #obtn .aboutHisListBox .liHis dl dd{width: 100%;} #obtn .aboutHisListBox .liHis dl dd .table{ height:auto; padding:6px 0;} #obtn .aboutHisListBox .liHis dl dd .table span{font-size: 14px; line-height: 24px;} #obtn .aboutHisListBox .liHis dl:after{left: 15px; margin-left: 0;} #obtn .aboutHisListBox .liHis dl.two dd{padding: 0 0 0 47px;} #obtn .aboutHisListBox .liHis dl.two dd .table span, #obtn .aboutHisListBox .liHis dl.two dd .table{text-align: left;} #obtn .aboutHisDate { margin-top:30px;} #obtn .aboutHisDate .dataBox{ font-size:18px; padding-top:25px;} } #obtn .honorBox{float: left; width: 100%; background: #f2f8fc; position: relative;} #obtn .honorBg{position: absolute; width: 100%; height: 100%; left: 0; top:0; opacity: 0.1;filter:alpha(opacity=10);} #obtn .honorInfo{float: left; width: 100%; margin: 100px 0 68px 0; position: relative; z-index: 2;} #obtn .honorList{float: left; width: 100%; /**margin-top: 54px;**/} #obtn .honorList ul{margin:0 -20px;} #obtn .honorList li{float: left; width: 25%; text-align: center; padding: 0 5px; margin-top: 45px;} #obtn .honorList li .honImg{float: left; width: 100%; text-align: center; height: 225px; display: table; line-height: 0;} #obtn .honorList li .honImg span{display: table-cell; vertical-align: middle; line-height: 0;} #obtn .honorList li .honImg span img{height: auto; box-shadow: 0 0 20px rgba(199,205,211,0.66); -moz-box-shadow: 0 0 20px rgba(199,205,211,0.66); -webkit-box-shadow: 0 0 20px rgba(199,205,211,0.66); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .honorList li .dText{float: left; width: 100%; color:#444444; font-size: 15px; line-height: 26px; margin-top:5px;height: 52px; text-align: center; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .honorList li .dText em{float: left; width: 100%;} #obtn .honorList li:nth-child(1){width:25%;} #obtn .honorList li:nth-child(2){width:24%;} #obtn .honorList li:nth-child(3){width:25%;} #obtn .honorList li:nth-child(4){width:25%;} #obtn .honorList li:nth-child(5){width:16.3%;} #obtn .honorList li:nth-child(6){width:16.3%;} #obtn .honorList li:nth-child(7){width:16.3%;} #obtn .honorList li:nth-child(8){width:50.5%;} #obtn .honorList li:hover span img{ box-shadow: 0 0 20px rgba(88,212,152,0.3); -moz-box-shadow: 0 0 20px rgba(88,212,152,0.3); -webkit-box-shadow: 0 0 20px rgba(88,212,152,0.3); } #obtn .honorList li:hover .dText{color:#58d498;} @media screen and (max-width:1229px) { #obtn .honorInfo{margin: 60px 0 60px 0} #obtn .honorList{margin-top: 25px;} #obtn .honorList ul{margin: 0 -15px;} #obtn .honorList li{margin-top: 20px; padding: 0 15px;} #obtn .honorList li .dText{margin-top: 20px;} } @media screen and (max-width:1023px) { #obtn .honorInfo{margin:50px 0} #obtn .honorList{margin-top: 15px;} #obtn .honorList ul{margin: 0 -10px;} #obtn .honorList li{padding: 0 10px;} #obtn .honorList li .honImg{height: 160px;} #obtn .honorList li .dText{font-size: 14px; display: block; line-height: 24px; height: 48px;} #obtn .honorList li .dText em{float: none; width:auto;} } @media screen and (max-width:767px) { #obtn .honorInfo{margin:40px 0 30px 0;} #obtn .honorList{margin-top: 10px;} #obtn .honorList ul{margin:0 -6px;} #obtn .honorList li{width: 33.3333%; padding: 0 6px; margin-top: 0px;padding-bottom: 30px;} #obtn .honorList li:nth-child(3), #obtn .honorList li:nth-child(4), #obtn .honorList li:nth-child(5), #obtn .honorList li:nth-child(6){width: 33.3333%;} #obtn .honorList li:nth-child(7){width: 100%;} #obtn .honorList li:nth-child(8){width:67.9%;} #obtn .honorList li .honImg{overflow: hidden;} #obtn .honorList li .honImg span{height: 160px; overflow: hidden;} #obtn .honorList li .honImg img{width:auto; max-height: 100%;} /***#obtn .honorList li:nth-child(8) .honImg{height: 90px;}**/ #obtn .honorList li:nth-child(8) .honImg span{height: 90px; overflow: hidden;} } #obtn .aboutContact{float: left; width: 100%; margin: 107px 0 130px 0;} #obtn .contactSmall{float: left; width: 100%; margin-top: 80px;} #obtn .contactSmall .ulBox2{margin: 0 -10px;} #obtn .contactSmall .li5{float: left; width:20%; padding: 0 10px;} #obtn .contactSmall .li5 .conBox{float: left; width: 100%; background: #fff; padding: 30px 0 12px; cursor: pointer;border:1px solid #fff; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; box-shadow: 0 0 30px rgba(199,204,215,0.3); -moz-box-shadow: 0 0 30px rgba(199,204,215,0.3); -webkit-box-shadow: 0 0 30px rgba(199,204,215,0.3); border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; } #obtn .contactSmall .li5 .conBox.on, #obtn .contactSmall .li5 .conBox:hover{ border:1px solid #58d398; } #obtn .contactSmall .li5 .conBox .ico{float: left; width: 100%; text-align: center; line-height: 0;} #obtn .contactSmall .li5 .conBox .dText{float: left; width: 100%; text-align: center; color:#444444; font-size: 15px; line-height: 30px; height: 60px; margin-top: 5px;} #obtn .contactSmall .li5 .conBox .ico img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .contactSmall .li5 .conBox:hover .ico img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .contactMapBox{float: left; width: 100%; } #obtn .map{float: left;width: 100%;position: relative;margin-top: 75px;} #obtn #dituContent{width: 100%;height: 100%; height:506px; float: left;overflow: hidden;position: relative;z-index: 0;color: rgb(0, 0, 0);text-align: left;background-color: rgb(243, 241, 236);} #obtn #dituContent img{max-width:none;} /*.BMap_pop,.BMap_shadow,.anchorBL,.BMapLabel{display:none !important;}*/ /*隐藏标题块*/ #obtn .BMap_pop > img{display: none !important;} #obtn .BMap_pop > div{display: none !important;} #obtn .BMap_pop > div:nth-child(9){display: block !important;width: 140px !important; height: 55px !important;left: 38px !important;top: 56px !important;} #obtn .BMap_pop > div:nth-child(9) .BMap_bubble_content{display: none !important;} #obtn .BMap_pop > div:nth-child(9) .BMap_bubble_content .iw_poi_content{display: none;} #obtn .BMap_pop > div:nth-child(9) .BMap_bubble_content{background: url(images/img_map_1.png) no-repeat center !important;width: 140px !important; height: 55px !important; left: 0!important;top: 0!important;margin: 0!important;padding: 0 !important;border: 0 !important;} #obtn .BMap_pop > div:nth-child(9) .BMap_bubble_content .iw_poi_title{display: block !important;float: left !important;width: 100% !important;text-align: center !important;height: 45px !important;line-height: 45px !important;font-size: 16px !important;color: #fff !important;} #obtn .BMap_shadow{display: none !important;} #obtn .BMapLabel{display: block !important;border: 0 none !important;padding: 0 !important;background:url(_im_g/img_map_2.png) no-repeat center !important;width: 27px !important;height: 27px !important;max-width: none !important;margin-bottom: 0 !important;} #obtn .BMapLabel span{display: block;position: absolute;left: 50%;margin-left: -131px;top: -53px; background:#24c887; min-width: 262px;text-align: center;line-height:25px;font-size: 16px;color: #fff; padding:15px; border-radius:8px;} #obtn .BMapLabel span:after{ float:left; width:0; height:0; content:''; position:absolute; left:50%; bottom:-9px; border-left:8px solid transparent; border-right:8px solid transparent;border-top: 10px solid #24c887; margin-left:-8px;} @media screen and (max-width:1023px){ #obtn .map{margin-top: 25px;} #obtn #dituContent{ height:300px;} } #obtn .contactMapBox .li1{float: left; width: 100%; display: none;} #obtn .contactMapBox .li1:first-Child{display:block;} #obtn .conAddress{float: left; width: 100%; background: #fff; border-bottom: 1px solid #e5e5e5; padding: 23px 0 14px 0;} #obtn .conAddress dd{float: left; margin-right: 100px;} #obtn .conAddress dd .tH1{display: block; color:#444444; font-size: 16px; line-height: 35px;} #obtn .conAddress dd .tH1 img{vertical-align: middle; margin-top: -3px;} #obtn .conAddress dd .dP1{display: block; color:#999999; font-size: 14px; margin-top: 5px; line-height: 24px; height: 48px;} #obtn .conAddress dd:last-child{margin-right: 0; float: right;width: 30%;} @media screen and (max-width:1229px) { #obtn .map{margin-top:45px;} #obtn .aboutContact{margin:80px 0 100px 0} #obtn .contactSmall{margin-top: 60px;} #obtn .conAddress dd{margin-right: 65px;} #obtn .contactSmall .li5 .conBox{ box-shadow: 0 0 15px rgba(199,204,215,0.3); -moz-box-shadow: 0 0 15px rgba(199,204,215,0.3); -webkit-box-shadow: 0 0 15px rgba(199,204,215,0.3); } } @media screen and (max-width:1023px) { #obtn .aboutContact{margin:60px 0 70px 0} #obtn .contactSmall{margin-top: 40px;} #obtn .contactSmall .li5 .conBox{padding: 15px 0 12px 0;} #obtn .contactSmall .li5 .conBox .ico img{width: 60px;} #obtn .contactSmall .li5 .conBox .dText{font-size: 15px; line-height: 26px; height: 52px;} #obtn .bdmap{height: 350px;} #obtn .conAddress dd{width: 50% !important ; margin-right: 0;} #obtn .conAddress dd .tH1{font-size: 15px;} #obtn .conAddress dd .dP1{font-size: 15px;} } @media screen and (max-width:767px) { #obtn .map{margin-top:10px;} #obtn .aboutContact{margin:40px 0} #obtn .contactSmall{margin-top: 10px;} #obtn .contactSmall .li5{width: 33.333%; margin-top: 10px;} #obtn .contactSmall .li5 .conBox .dText{font-size: 14px; line-height: 24px; height: 48px;} #obtn .contactSmall .li5 .conBox .ico img{width: 50px;} #obtn .conAddress dd .dP1{font-size: 14px;} } #obtn .partnerBox{float: left; width: 100%; background: #f4fafe; position: relative} #obtn .partnerBg{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity: 0.15;filter:alpha(opacity=15);} #obtn .partnerInfo{float: left; width: 100%; margin: 85px 0 115px 0;} #obtn .partnerInfo .logoListBox{margin-top: 50px;} #obtn .partnerInfo .logoListBox li{width:16.6666%;margin-top: 30px;} #obtn .partnerInfo .logoListBox li .ico{border:0; box-shadow: 0 0 24px rgba(192,195,201,0.3); -moz-box-shadow: 0 0 24px rgba(192,195,201,0.3); -webkit-box-shadow: 0 0 24px rgba(192,195,201,0.3); } #obtn .partnerInfo .logoListBox li .ico img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .partnerInfo .logoListBox li .ico:hover img{ transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1); } @media screen and (max-width:1229px) { #obtn .partnerInfo{ margin: 65px 0 85px 0;} #obtn .partnerInfo .logoListBox{margin-top:25px;} } @media screen and (max-width:1023px) { #obtn .partnerInfo{ margin: 60px 0 70px 0;} #obtn .partnerInfo .logoListBox li{width:20%;margin-top: 20px;} } @media screen and (max-width:767px) { #obtn .partnerInfo{ margin: 40px 0;} #obtn .partnerInfo .logoListBox{margin-top: 15px;} #obtn .partnerInfo .logoListBox ul{margin: 0 -7px;} #obtn .partnerInfo .logoListBox li{width:33.333%;margin-top: 14px; padding: 0 7px;} } #obtn .homeNewsList.aboutNBox{border-bottom: 1px solid #e6e6e6; padding-bottom: 15px;} #obtn .homeNewsList li .newsWord .dText.aboutNews{padding: 0; border:0;} #obtn .homeNewsList li .newsWord .dText.aboutNews .newLi1{ background: #f5f7fa; padding: 23px 30px 18px 30px; border-bottom: 0;} #obtn .homeNewsList li .newsWord .dText.aboutNews dl{padding:0 30px 21px 30px} #obtn .newMore.aboutNM a{border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; } @media screen and (max-width:1229px) { #obtn .homeNewsList li .newsWord .dText.aboutNews .newLi1{padding: 15px 20px; } #obtn .homeNewsList li .newsWord .dText.aboutNews dl{padding:0 20px 15px 20px} } /*产品定价-地图引擎*/ #obtn .proTableBox.MapEngine .proDt .dd.first span{color:#444444; font-size: 20px;} #obtn .proTableBox.MapEngine .proDl .dd.first{position: relative} #obtn .proTableBox.MapEngine .proDl.one .dd.first{border-top:1px solid #e5e5e5} #obtn .proTableBox.MapEngine .proDl .dd.first .triangleBox{position: absolute; width: 72px; height: 72px; right: 0; top:0;} #obtn .proTableBox.MapEngine .proDl .dd.first .triangleBox:after{position: absolute; content: ''; right: 0; top:0; width: 0; height: 0; border-right: 72px solid #2b99ff; border-bottom: 72px solid transparent; } #obtn .proTableBox.MapEngine .proDl .dd.first .triangleBox i{color:#fff; font-size: 18px; line-height: 24px;position: absolute; z-index: 5; right: 6px; top:10px; transform:rotate(45deg); -ms-transform:rotate(45deg); /* IE 9 */ -moz-transform:rotate(45deg); /* Firefox */ -webkit-transform:rotate(45deg); /* Safari 和 Chrome */ -o-transform:rotate(45deg); } #obtn .proTableBox.MapEngine .proDl.three .triangleBox:after{ border-right: 72px solid #fca029!important; } #obtn .proTableBox.MapEngine .proDt .dd.first{height: 156px; background: #f5f7fa;} #obtn .proTableBox.MapEngine .proDt .dd.two{height:208px;} #obtn .proTableBox.MapEngine .proDt .dd.three{height:764px;} #obtn .proTableBox.MapEngine .proDt .dd.four{height:625px;} #obtn .proTableBox.MapEngine .proDt .dd.five{height:556px;} #obtn .proTableBox.MapEngine .proDt .dd.six{height:485px;} #obtn .proTableBox.MapEngine .proDt .dd.seven{height:902px;} #obtn .proTableBox.MapEngine .proDt .dd.eight{height:834px;} #obtn .proTableBox.MapEngine .proDt .dd.nine{height:485px;} #obtn .proTableBox.MapEngine .proDt .dd.ten{height:207px;} #obtn .proTableBox.MapEngine .proDl .dd.first{height: 157px;} #obtn .proTableBox.MapEngine .proDl .dd{height: 69px;} #obtn .proTableBox.MapEngine .proDl .dd.two{height: 70px;} #obtn .proTableBox .proDt.phoneN{display: none;} #obtn .proTableBox .proDl.phoneN{display: none;} @media screen and (max-width:1023px) { #obtn .proTableBox.MapEngine .proDt .dd.first span{font-size: 18px;} } @media screen and (max-width:767px){ #obtn .proTableBox .proDt.phoneN{display: block;} #obtn .proTableBox .proDl.phoneN{display: block;} #obtn .proTableBox.MapEngine .proDt{width: 25%;} #obtn .proTableBox.MapEngine .proDl{width: 40%;} #obtn .proTableBox.MapEngine .proDl.two, #obtn .proTableBox.MapEngine .proDl.three{width:35%;} #obtn .proTableBox.MapEngine .proDl .dd.first .table em a{width: 105px;} } /*云平台-室内定位*/ #obtn .iBanner.cloudBanner{ background: #239bca; background: -webkit-linear-gradient(left,#239bca,#4bc6c2); background: -o-linear-gradient(left,#239bca,#4bc6c2); background: -moz-linear-gradient(left,#239bca,#4bc6c2); background: -ms-linear-gradient(left,#239bca,#4bc6c2); background: linear-gradient(to right,#239bca,#4bc6c2); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#239bca), color-stop(100%,#4bc6c2)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#239bca', endColorstr='#4bc6c2',GradientType=0); } /*#obtn .iBanner.cloudBanner .box{opacity: 0.15;filter:alpha(opacity=15);}*/ #obtn .iBanner.cloudBanner .pageBanSol{margin-top: -80px;} #obtn .iBanner.cloudBanner .pageBanSol .aHref{float: left; width: 100%; margin-top: 24px;} #obtn .iBanner.cloudBanner .pageBanSol .dtksh{float: left; width: 100%; margin-top: 20px;} #obtn .iBanner.cloudBanner .pageBanSol .dtksh a{color: #fff;font-size: 1.4em;border:black;font-weight: 600;background: linear-gradient(to right,#04c0f0,#17e8be);} #obtn .iBanner.cloudBanner .pageBanSol .dtksh a:hover{color: #fff;font-weight: 600;background: linear-gradient(to right,#33c08a,#5cd499);} #obtn .iBanner.cloudBanner .pageBanSol .p5{width: 55%;} #obtn .iBanner.cloudBanner .pageBanSol a{float: left; width: 180px; height: 50px; border:1px solid #fff; border-radius: 2px; text-align: center; line-height: 48px; color:#fff; font-size: 16px;border-radius: 4px;} #obtn .iBanner.cloudBanner .pageBanSol a:hover{background: #fff; background: rgba(255,255,255,0.8); color:#58d498;} @media screen and (max-width:1229px) { #obtn .iBanner.cloudBanner .pageBanSol{margin-top: -96px;} #obtn .iBanner.cloudBanner .pageBanSol .aHref{margin-top: 30px;} #obtn .iBanner.cloudBanner .pageBanSol a{ width: 160px; height: 40px;line-height: 38px; } } @media screen and (max-width:1023px) { #obtn .iBanner.cloudBanner .pageBanSol{margin-top: -83px;} #obtn .iBanner.cloudBanner .pageBanSol .aHref{margin-top: 15px;} #obtn .iBanner.cloudBanner .pageBanSol .p5{width: 100%} #obtn .iBanner.cloudBanner .pageBanSol a{ width: 140px; height: 35px;line-height: 33px; font-size: 15px;} } @media screen and (max-width:767px) { #obtn .iBanner.cloudBanner .pageBanSol{margin-top: -55px;} #obtn .iBanner.cloudBanner .pageBanSol .aHref{margin-top: 6px;} #obtn .iBanner.cloudBanner .pageBanSol a{ width: 100px; height: 26px;line-height: 24px; font-size: 14px;} #obtn .iBanner.cloudBanner .pageBanSol .dtksh a{color: #fff;font-size: 0.8em;border:black;font-weight: 600;background: linear-gradient(to right,#04c0f0,#17e8be);} } #obtn .cloudSecBox{float: left; width: 100%; background: #f7f8fc;} #obtn .cloudSecondLevel{float: left; width: 100%; padding: 13px 0 12px 0;} #obtn .cloudSecondLevel li{float: left; width: 25%; display: block; text-align: center;} #obtn .cloudSecondLevel li a{display: inline-block; width: 160px;padding-bottom: 13px; position: relative} #obtn .cloudSecondLevel li a:after{position: absolute; content: ''; left: 50%; margin-left: -20px; bottom:0;width: 0;height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-top: 0 solid #fff; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .cloudSecondLevel li a.on, #obtn .cloudSecondLevel li a:hover{background: #fff; position: relative; z-index: 9; box-shadow: 0 0 20px rgba(120,131,144,0.3); -moz-box-shadow: 0 0 20px rgba(120,131,144,0.3); -webkit-box-shadow: 0 0 20px rgba(120,131,144,0.3); } #obtn .cloudSecondLevel li a.on:after, #obtn .cloudSecondLevel li a:hover:after{ border-top: 20px solid #fff;bottom:-20px; } #obtn .cloudSecondLevel li .tIco{float: left; width: 100%; text-align: center;line-height:0; margin-top: 12px;} #obtn .cloudSecondLevel li .tIco img{ width:60px; height:60px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .cloudSecondLevel li a:hover .tIco img{ transform:rotateY(360deg); -ms-transform:rotateY(360deg); -moz-transform:rotateY(360deg); -webkit-transform:rotateY(360deg); -o-transform:rotateY(360deg); } #obtn .cloudSecondLevel li .dText{float: left; width: 100%; text-align: center; line-height: 40px; color:#444444; font-size: 16px; padding-bottom: 10px; position: relative} #obtn .cloudSecondLevel li .dText:after{position: absolute; content: ''; left: 50%; margin-left: -15px; bottom: 0; width: 30px; height: 2px; background: #585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); } #obtn .slideBox.on .cloudSecondLevel{ padding:4px 0;} #obtn .slideBox.on .cloudSecondLevel li .tIco img{ width:40px; height:40px;} #obtn .slideBox.on .cloudSecondLevel li .dText{ font-size:14px; line-height:22px;} #obtn .slideBox.on .cloudSecondLevel li a{ padding-bottom:8px;} #obtn .slideBox.on .cloudSecondLevel li .tIco{ margin-top:6px;} #obtn .slideBox.on .cloudSecondLevel li .dText{ padding-bottom:5px;} #obtn .slideBox.on .cloudSecondLevel li a:after{ margin-left: -10px; border-left:10px solid transparent; border-right: 10px solid transparent;} #obtn .slideBox.on .cloudSecondLevel li a.on:after, #obtn .cloudSecondLevel li a:hover:after{ bottom:-10px; border-top: 10px solid #fff; } @media screen and (max-width:1023px) { #obtn .cloudSecondLevel li a{width: 140px;} #obtn .cloudSecondLevel li .tIco img{width:45px; height:45px;} #obtn .cloudSecondLevel li .dText{font-size: 16px; line-height: 35px;} } @media screen and (max-width:767px) { #obtn .cloudSecondLevel li a{width: 100%; padding-bottom: 10px;} #obtn .cloudSecondLevel li .dText{font-size: 13px; line-height: 30px; padding-bottom: 8px;} #obtn .cloudSecondLevel li .tIco img{width: 40px; height:40px;} #obtn .cloudSecondLevel li a:after{ margin-left: -13px; border-left: 13px solid transparent; border-right: 13px solid transparent; } #obtn .cloudSecondLevel li a.on:after, #obtn .cloudSecondLevel li a:hover:after{ border-top: 15px solid #fff;bottom:-15px; } #obtn .slideBox.on .cloudSecondLevel{ padding:2px 0 0 0;} #obtn .slideBox.on .cloudSecondLevel li .tIco img{ width:36px; height:36px;} #obtn .slideBox.on .cloudSecondLevel li .dText{ font-size:14px; line-height:22px;} #obtn .slideBox.on .cloudSecondLevel li a{ padding-bottom:4px;} #obtn .slideBox.on .cloudSecondLevel li .tIco{ margin-top:3px;} #obtn .slideBox.on .cloudSecondLevel li .dText{ padding-bottom:2px;} #obtn .slideBox.on .cloudSecondLevel li a:after{ margin-left: -10px; border-left:10px solid transparent; border-right: 10px solid transparent;} #obtn .cloudSecondLevel li a.on, #obtn .cloudSecondLevel li a:hover{background: #fff; position: relative; z-index: 9; box-shadow: 0 0 10px rgba(120,131,144,0.3); -moz-box-shadow: 0 0 10px rgba(120,131,144,0.3); -webkit-box-shadow: 0 0 10px rgba(120,131,144,0.3); } #obtn .slideBox.on .cloudSecondLevel li a.on:after, #obtn .cloudSecondLevel li a:hover:after{ bottom:-10px; border-top: 10px solid #fff; } } #obtn .locationBox{float: left; width: 100%; margin: 85px 0 130px 0;} #obtn .locationTable{float: left; width: 100%; margin-top: 48px;} #obtn .locationTable .dtBox{float: left; width: 100%; background: #40537a; padding-left: 13%; border-radius: 10px 10px 0 0; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; } #obtn .locationTable .dtBox dt{float: left; width:20%; padding-left: 4%;color:#ffffff; font-size: 16px;line-height:60px;} #obtn .locationTable .dlBox{float: left; width: 100%; border-bottom: 2px solid #eaeef7; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .locationTable .dlBox.two{background: #eaeef7; background: rgba(234,238,247,0.4);} #obtn .locationTable .dlBox:last-child{border-bottom: 0;} #obtn .locationTable .dlBox dd:first-child{float:left; width: 13%; text-align: center; background: #f4f6fb; font-size: 16px; line-height: 78px; position:relative; padding-left: 0;} #obtn .locationTable .dlBox dd:first-child:after{position: absolute; content: ''; width: 2px; height: 52px; top:50%; margin-top: -26px; right: 0; background: #eaeef7} #obtn .locationTable .dlBox dd{float: left; width: 17.4%; display: table; height: 78px; padding-left:3.5%;} #obtn .locationTable .dlBox dd span{display: table-cell; vertical-align: middle; color:#444444; font-size: 15px; line-height: 24px;} #obtn .locationTable .dlBox:hover{ position: relative; z-index: 2; box-shadow: 0 0 10px rgba(0,0,0,0.1); -moz-box-shadow: 0 0 10px rgba(0,0,0,0.1); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.1); } @media screen and (max-width:1229px) { #obtn .locationBox{margin: 70px 0 100px 0} #obtn .locationTable .dtBox dt{padding-left: 3%;} #obtn .locationTable .dlBox dd{padding-left: 2.5%;} #obtn .locationTable .dlBox dd span{font-size: 14px;} } @media screen and (max-width:1023px) { #obtn .locationBox{margin: 55px 0 70px 0} #obtn .locationTable{margin-top:30px;} #obtn .locationTable .dtBox dt{font-size: 16px;} #obtn .locationTable .dlBox dd:first-child{font-size: 16px;} #obtn .locationTable .dlBox dd span{font-size: 12px; line-height: 22px;} } @media screen and (max-width:767px) { #obtn .locationBox{margin: 35px 0 40px 0} #obtn .locationTable{margin-top: 10px;} #obtn .locationTable .liTab{float: left; width: 100%; margin-top: 15px;} #obtn .locationTable .liTab dt{float: left; width: 100%; padding-left: 35%; font-size: 16px; line-height: 45px; background: #40537a; color:#fff; border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; } #obtn .locationTable .liTab dl{float: left; width: 100%; border-bottom: 1px solid #eaeef7; display: block;} #obtn .locationTable .liTab dd:first-child{float: left; width: 30%; background: #f4f6fb; color:#444444; font-size: 16px; height: 68px;line-height: 68px; position: relative; text-align: center} #obtn .locationTable .liTab dd:first-child:after{position: absolute; content: ''; width: 2px; height: 50px; top:50%; margin-top: -25px; right: 0;} #obtn .locationTable .liTab dd:last-child{float: right; width: 65%; height: 68px; display: table; padding-right: 10px;} #obtn .locationTable .liTab dd:last-child span{display:table-cell; vertical-align: middle; font-size: 14px; line-height: 24px; color:#444444} } #obtn .proFeaturesBox{float: left; width: 100%; background: #eef0f6; position: relative} #obtn .proFeaturesBg{position:absolute; left: 0; top:0; width: 100%; height: 100%; opacity:0.05;filter:alpha(opacity=5);} #obtn .proFeaturesInfo{float: left; width: 100%; position: relative; z-index: 2; margin: 50px 0 90px 0;} #obtn .proFeaturesInfo .proCenImg{float: left; width: 62%; text-align: center; line-height: 0; margin-top: 53px; position: relative; z-index: 9;} #obtn .proFeaturesInfo .proLeft{float: left; width:19%;} #obtn .proFeaturesInfo .proLeft dd{float: left; width: 100%; padding-right: 25px; position: relative; margin-top: 70px;} #obtn .proFeaturesInfo .proLeft dd:first-child{margin-top: 46px;} #obtn .proFeaturesInfo .proLeft dd span{float: left; width: 100%; text-align: center; background: #fff; color:#444444; font-size: 16px;line-height: 70px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .proFeaturesInfo .proLeft dd i{position: absolute; z-index: 3; width: 50px; height: 50px; line-height: 0; right: 0; top:50%; margin-top: -25px; border-radius: 25px; -moz-border-radius: 25px; -webkit-border-radius: 25px; background: #239bca; background: -webkit-linear-gradient(left,#239bca,#4bc6c2); background: -o-linear-gradient(left,#239bca,#4bc6c2); background: -moz-linear-gradient(left,#239bca,#4bc6c2); background: -ms-linear-gradient(left,#239bca,#4bc6c2); background: linear-gradient(to right,#239bca,#4bc6c2); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#239bca), color-stop(100%,#4bc6c2)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#239bca', endColorstr='#4bc6c2',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .proFeaturesInfo .proLeft dd i img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .proFeaturesInfo .proLeft dd:hover span{ box-shadow: 0 0 10px rgba(0,0,0,0.1); -moz-box-shadow: 0 0 10px rgba(0,0,0,0.1); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.1); } #obtn .proFeaturesInfo .proLeft dd:hover i img{ transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1); } #obtn .proFeaturesInfo .proLeft dd:hover i{ transform:rotateY(360deg); -moz-transform:rotateY(360deg); -webkit-transform:rotateY(360deg); -o-transform:rotateY(360deg); -ms-transform:rotateY(360deg); } #obtn .proFeaturesInfo .proLeft dd em{position: absolute; width: 263px; height: 76px; line-height: 0; left: 90%; top:32px; z-index: 2;} #obtn .proFeaturesInfo .proLeft dd:nth-child(2) em{ height:6px;} #obtn .proFeaturesInfo .proLeft dd:nth-child(3) em{top: auto; bottom:32px;} #obtn .proFeaturesInfo .proLeft.right{float: right;} #obtn .proFeaturesInfo .proLeft.right dd{padding: 0 0 0 25px;} #obtn .proFeaturesInfo .proLeft.right dd i{right: auto; left: 0;} #obtn .proFeaturesInfo .proLeft.right dd em{left: auto; right:90%;} @media screen and (max-width:1229px) { #obtn .proFeaturesInfo .proLeft dd span{font-size: 16px;} } @media screen and (max-width:1023px) { #obtn .proFeaturesInfo{margin: 50px 0 60px 0;} #obtn .proFeaturesInfo .proLeft{width: 24%;} #obtn .proFeaturesInfo .proCenImg{width: 52%; margin-top: 60px;} #obtn .proFeaturesInfo .proLeft dd{margin-top: 45px; padding-right: 20px;} #obtn .proFeaturesInfo .proLeft dd:first-child{margin-top: 30px;} #obtn .proFeaturesInfo .proLeft dd i{width: 40px; height: 40px; margin-top: -20px;} #obtn .proFeaturesInfo .proLeft.right dd{padding: 0 0 0 20px;} } @media screen and (max-width:767px) { #obtn .proFeaturesInfo{margin:35px 0 40px 0;} #obtn .proFeaturesInfo .proLeft{width: 100%; margin-top: 10px;} #obtn .proFeaturesInfo .proLeft.right{margin-top: 0;} #obtn .proFeaturesInfo .proCenImg{width: 100%; margin-top: 25px;} #obtn .proFeaturesInfo .proLeft dd{margin-top: 15px;} #obtn .proFeaturesInfo .proLeft dd:first-child{margin-top: 15px;} #obtn .proFeaturesInfo .proLeft dd em{display: none;} #obtn .proFeaturesInfo .proLeft dd span{height: 50px; line-height: 50px;} } #obtn .PosEffectBox{float: left; width: 100%; margin: 100px 0 115px 0;} #obtn .PosEffectImg{float: left; width: 100%; text-align: center; line-height: 0; margin-top: 65px;} #obtn .PosEffectImg img{ cursor: pointer; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .PosEffectImg img:hover{ box-shadow: 0 0 15px rgba(0,0,0,0.3); -moz-box-shadow: 0 0 15px rgba(0,0,0,0.3); -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.3); } #obtn .PosEffectMore{float: left; width: 100%; display: block; text-align: center; margin-top: 70px;} #obtn .PosEffectMore a{display: inline-block; width: 180px; height: 50px; text-align: center; line-height: 50px; color:#fff; font-size: 16px; background: #00d6ae; position: relative; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .PosEffectMore a:before { content: '';position: absolute;top: -20px;left: -20px;bottom: -20px;right: -20px;background: inherit;border-radius: 50px;z-index: -1;opacity: 0.4; -webkit-transform: scale3d(0.8, 0.5, 1); -moz-transform: scale3d(0.8, 0.5, 1); -o-transform: scale3d(0.8, 0.5, 1); transform: scale3d(0.8, 0.5, 1); } #obtn .PosEffectMore a:hover { -webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s; transition: background-color 0.1s 0.3s, color 0.1s 0.3s; color: #fff; background-color: #58d498; -webkit-animation: anim-moema-1 0.3s forwards; -moz-animation: anim-moema-1 0.3s forwards; -o-animation: anim-moema-1 0.3s forwards; animation: anim-moema-1 0.3s forwards; } #obtn .PosEffectMore a:hover:before { -webkit-animation: anim-moema-2 0.3s 0.3s forwards; -moz-animation: anim-moema-2 0.3s 0.3s forwards; -o-animation: anim-moema-2 0.3s 0.3s forwards; animation: anim-moema-2 0.3s 0.3s forwards; } @media screen and (max-width:1229px) { #obtn .PosEffectBox{margin: 70px 0 80px 0;} #obtn .PosEffectImg{margin-top: 45px;} #obtn .PosEffectMore{margin-top: 55px;} } @media screen and (max-width:1023px) { #obtn .PosEffectBox{margin:60px 0;} #obtn .PosEffectImg{margin-top: 35px;} #obtn .PosEffectMore{margin-top: 40px;} } @media screen and (max-width:767px) { #obtn .PosEffectBox{margin:35px 0 40px 0;} #obtn .PosEffectImg{margin-top: 25px;} #obtn .PosEffectMore{margin-top: 30px;} #obtn .PosEffectMore a{width: 160px; height: 40px; line-height: 40px;} } #obtn .BottomConBox.IndoorMake{ background: #239bca; background: -webkit-linear-gradient(left,#239bca,#4bc6c2); background: -o-linear-gradient(left,#239bca,#4bc6c2); background: -moz-linear-gradient(left,#239bca,#4bc6c2); background: -ms-linear-gradient(left,#239bca,#4bc6c2); background: linear-gradient(to right,#239bca,#4bc6c2); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#239bca), color-stop(100%,#4bc6c2)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#239bca', endColorstr='#4bc6c2',GradientType=0); } #obtn .BottomConBox.IndoorMake .BottomConBg{opacity: 0.1;filter:alpha(opacity=10);} #obtn .BottomConBox.IndoorMake .more a{width: 220px;} #obtn .BottomConBox.IndoorMake .more a img{ vertical-align: middle; margin-top: -3px;} #obtn .BottomConBox.IndoorMake .more a:hover{background: #2cd182; color:#fff;} @media screen and (max-width:767px) { #obtn .BottomConBox.IndoorMake .more a{width: 150px;} #obtn .BottomConBox.IndoorMake .more a img{width: 24px;} } /*云平台-制图编辑器*/ #obtn .iBanner.cloudBanner .pageBanSol.draftingBan{margin-top: -134px;} @media screen and (max-width:1229px) { #obtn .iBanner.cloudBanner .pageBanSol.draftingBan{margin-top: -120px;} #obtn .iBanner.cloudBanner .pageBanSol.draftingBan .p5{width: 60%;} } @media screen and (max-width:1023px) { #obtn .iBanner.cloudBanner .pageBanSol.draftingBan{margin-top: -105px;} #obtn .iBanner.cloudBanner .pageBanSol.draftingBan .p5{width: 100%;} } @media screen and (max-width:767px) { #obtn .iBanner.cloudBanner .pageBanSol.draftingBan{margin-top: -55px;} } #obtn .cloudSecBox.draftingSec{background: #fff;} #obtn .proInfoBox{float: left; width: 100%; background: #f5f7fa;} #obtn .proInfoBox .proIntroduction{float: left; width:100%; margin: 100px 0 75px 0;} #obtn .proIntroduction .proInText{float: left; width: 38%;} #obtn .proIntroduction .proInImg{float: left; width: 62%; line-height: 0;} #obtn .proIntroduction .proInImg img{ cursor: pointer; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .proIntroduction .proInImg img:hover{ box-shadow: 0 0 10px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2); } #obtn .proIntroduction .proInText .pageTit{text-align: left; margin-top: 7px;} #obtn .proIntroduction .proInText ul{float: left; width: 100%; margin-top: 15px;} #obtn .proIntroduction .proInText li{float: left; width: 100%; margin-top: 25px; height: 70px; padding-left: 80px; display: table;position: relative; } #obtn .proIntroduction .proInText li span{display:table-cell; vertical-align: middle; color:#444444; font-size: 16px; line-height: 30px;} #obtn .proIntroduction .proInText li i{position: absolute; left: 0; top:0; width: 70px; height: 70px; background: #edf0f5; line-height: 0; border-radius: 35px; -moz-border-radius: 35px; -webkit-border-radius: 35px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .proIntroduction .proInText li i img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .proIntroduction .proInText li:hover i{ transform:rotateY(360deg); -ms-transform:rotateY(360deg); -moz-transform:rotateY(360deg); -webkit-transform:rotateY(360deg); -o-transform:rotateY(360deg); } #obtn .proIntroduction .proInText li:hover i img{ transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1); } @media screen and (max-width:1229px) { #obtn .proInfoBox .proIntroduction{margin:75px 0;} #obtn .proIntroduction .proInText li{margin-top: 20px;} } @media screen and (max-width:1023px) { #obtn .proInfoBox .proIntroduction{margin: 60px 0;} #obtn .proIntroduction .proInText{width: 45%;} #obtn .proIntroduction .proInImg{width: 55%; margin-top: 35px;} #obtn .proIntroduction .proInText ul{margin-top: 5px;} #obtn .proIntroduction .proInText li{height: 60px; padding-left: 70px; margin-top: 15px;} #obtn .proIntroduction .proInText li i{width: 60px; height: 60px;} } @media screen and (max-width:767px) { #obtn .proInfoBox .proIntroduction{margin: 35px 0 40px 0;} #obtn .proIntroduction .proInText{width:100%;} #obtn .proIntroduction .proInText .pageTit{text-align: center; margin-top: 0;} #obtn .proIntroduction .proInImg{width:100%; margin-top: 20px;} #obtn .proIntroduction .proInText ul{margin-top: 0;} #obtn .proIntroduction .proInText li{padding-left: 65px; margin-top: 12px;} #obtn .proIntroduction .proInText li i{width: 50px; height: 50px; top:50%; margin-top: -25px;} } #obtn .proFunctionBox{float: left; width: 100%; background: #69abde;} #obtn .proFunInfo{float: left; width: 100%; margin: 60px 0 80px 0;} #obtn .proFunInfo .pageTit{color:#fff;} #obtn .proFunList{float: left; width: 100%; border:2px solid #e7e9f0; background: #f7f8fc; margin-top: 45px;} #obtn .proFunList .proFunImgBox{float: left; width:71%;} #obtn .proFunList .proFunImgBox .li1{float: left; width: 100%; line-height: 0; text-align: center; padding: 15px;} #obtn .proFunList .proFunIco{float:left; width: 29%; background: #e6e9f0;} #obtn .proFunList .proFunIco .dd1{float: left; width: 100%; text-align:center; color:#444444; font-size: 16px; background: #fff; margin-top: 1px; line-height: 79px;cursor:pointer; transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; } #obtn .proFunList .proFunIco .on .dd1, #obtn .proFunList .proFunIco .dd1:hover{color:#fff; background: #00b6b5; background: -webkit-linear-gradient(left,#00b6b5,#00d9ad); background: -o-linear-gradient(left,#00b6b5,#00d9ad); background: -moz-linear-gradient(left,#00b6b5,#00d9ad); background: -ms-linear-gradient(left,#00b6b5,#00d9ad); background: linear-gradient(to right,#00b6b5,#00d9ad); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#00b6b5), color-stop(100%,#00d9ad)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b6b5', endColorstr='#00d9ad',GradientType=0); } @media screen and (max-width:1229px) { #obtn .proFunInfo{margin: 60px 0 70px 0;} #obtn .proFunList{margin-top: 35px;} #obtn .proFunList .proFunIco .dd1{height: 67px; line-height: 67px; font-size: 16px;} } @media screen and (max-width:1023px) { #obtn .proFunInfo{margin: 50px 0 60px 0;} #obtn .proFunList{margin-top: 30px;} #obtn .proFunList .proFunIco .dd1{height: 51px; line-height: 51px; font-size: 14px;} } @media screen and (max-width:767px) { #obtn .proFunInfo{margin: 35px 0 40px 0;} #obtn .proFunList{margin-top: 20px;} #obtn .proFunList .proFunImgBox{width: 100%;} #obtn .proFunList .proFunIco{width: 100%;} #obtn .proFunList .proFunIco ul{ white-space:nowrap; overflow:auto;} #obtn .proFunList .proFunIco ul li{ width:50%; display:inline-block; vertical-align:top;} #obtn .proFunList .proFunIco .dd1{height: 46px; line-height: 46px;} } #obtn .priAdvantagesBox{float: left; width: 100%; margin: 97px 0 120px 0;} #obtn .priAdvList{float: left; width: 100%; margin-top: 15px;} #obtn .priAdvList ul{margin: 0 -45px;} #obtn .priAdvList li{float: left; width: 33.3333%; padding: 0 45px; margin-top: 60px;} #obtn .priAdvList li .li3{float: left; width: 100%; background: #fff; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; box-shadow: 0 0 27px rgba(152,160,179,0.3); -moz-box-shadow: 0 0 27px rgba(152,160,179,0.3); -webkit-box-shadow: 0 0 27px rgba(152,160,179,0.3); } #obtn .priAdvList li .li3:hover{ box-shadow: 0 0 30px rgba(152,160,179,0.5); -moz-box-shadow: 0 0 30px rgba(152,160,179,0.5); -webkit-box-shadow: 0 0 30px rgba(152,160,179,0.5); } #obtn .priAdvList li .li3 .tIco{float: left; width: 100%; line-height: 0; margin-top:55px; text-align: center;} #obtn .priAdvList li .li3 .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .priAdvList li .li3:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .priAdvList li .li3 h3{float: left; width: 100%; text-align: center; color:#444444; font-size:18px; line-height: 35px; padding-bottom: 12px; position: relative; margin-top:30px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .priAdvList li .li3:hover h3{color:#58d498;} #obtn .priAdvList li .li3 h3:after{position: absolute; content: ''; width: 30px; height: 2px; left: 50%; margin-left: -15px; bottom: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .priAdvList li .li3:hover h3:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .priAdvList li .li3 .dText{float: left; width: 100%; text-align: left; color:#777777; font-size: 15px; line-height: 30px; padding: 0 50px; margin-top:39px; margin-bottom:45px; height:90px;} @media screen and (max-width:1229px) { #obtn .priAdvantagesBox{margin: 80px 0 95px 0;} #obtn .priAdvList{margin-top: 5px;} #obtn .priAdvList ul{margin: 0 -25px;} #obtn .priAdvList li{padding: 0 25px; margin-top: 40px;} #obtn .priAdvList li .li3 .dText{padding: 0 35px;} } @media screen and (max-width:1023px) { #obtn .priAdvantagesBox{margin: 60px 0;} #obtn .priAdvList ul{margin: 0 -15px;} #obtn .priAdvList li{padding: 0 15px; margin-top: 30px;} #obtn .priAdvList li .li3 .tIco{margin-top: 40px;} #obtn .priAdvList li .li3 h3{margin-top: 20px;} #obtn .priAdvList li .li3 .dText{padding: 0 20px; margin:25px 0 35px 0; font-size: 15px;} } @media screen and (max-width:767px) { #obtn .priAdvantagesBox{margin:35px 0 40px 0;} #obtn .priAdvList li{padding: 0 15px; width: 100%; margin-top: 15px;} #obtn .priAdvList li .li3 .tIco{margin-top: 20px;} #obtn .priAdvList li .li3 .tIco img{width: 45px; height: 45px;} #obtn .priAdvList li .li3 h3{margin-top: 10px;} #obtn .priAdvList li .li3 .dText{height: auto; margin: 15px 0 20px 0; font-size: 14px;line-height: 26px;} } /*云平台-主题编辑器*/ #obtn .ProThemeInfo{float: left; width:100%; margin: 125px 0 120px 0;} #obtn .ProThemeInfo .ProThemeText{float: left; width: 40%; height: 450px; display: table;} #obtn .ProThemeInfo .ProThemeText .table{display: table-cell; vertical-align: middle; width: 100%;} #obtn .ProThemeInfo .ProThemeText .pageTit{text-align: left;} #obtn .ProThemeInfo .ProThemeText .p1{float: left; width: 100%; color:#444444; font-size: 16px; line-height: 30px; margin-top: 20px;} #obtn .ProThemeInfo .ProThemeText .more{float: left; width: 100%; margin-top: 40px;} #obtn .ProThemeInfo .ProThemeText .more a{float: left; width: 180px; height: 50px; background: #00d6ae; color:#fff; font-size: 16px; text-align: center; line-height: 50px; position: relative; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .ProThemeInfo .ProThemeText .more a:before { content: '';position: absolute;top: -20px;left: -20px;bottom: -20px;right: -20px;background: inherit;border-radius: 50px;z-index: -1;opacity: 0.4; -webkit-transform: scale3d(0.8, 0.5, 1); -moz-transform: scale3d(0.8, 0.5, 1); -o-transform: scale3d(0.8, 0.5, 1); transform: scale3d(0.8, 0.5, 1); } #obtn .ProThemeInfo .ProThemeText .more a:hover { -webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s; transition: background-color 0.1s 0.3s, color 0.1s 0.3s; color: #fff; background-color: #58d498; -webkit-animation: anim-moema-1 0.3s forwards; -moz-animation: anim-moema-1 0.3s forwards; -o-animation: anim-moema-1 0.3s forwards; animation: anim-moema-1 0.3s forwards; } #obtn .ProThemeInfo .ProThemeText .more a:hover:before { -webkit-animation: anim-moema-2 0.3s 0.3s forwards; -moz-animation: anim-moema-2 0.3s 0.3s forwards; -o-animation: anim-moema-2 0.3s 0.3s forwards; animation: anim-moema-2 0.3s 0.3s forwards; } #obtn .ProThemeInfo .ProThemeImg{float: right; width: 53%; line-height: 0; box-shadow: 0 8px 10px rgba(91,91,91,0.19); -moz-box-shadow: 0 8px 10px rgba(91,91,91,0.19); -webkit-box-shadow: 0 8px 10px rgba(91,91,91,0.19); } @media screen and (max-width:1229px) { #obtn .ProThemeInfo{margin: 90px 0;} #obtn .ProThemeInfo .ProThemeText{height: 375px;} } @media screen and (max-width:1023px) { #obtn .ProThemeInfo{margin: 60px 0;} #obtn .ProThemeInfo .ProThemeText{height:auto; width: 100%;} #obtn .ProThemeInfo .ProThemeImg{width: 100%; margin-top: 30px;} #obtn .ProThemeInfo .ProThemeText .more{margin-top: 20px;} } @media screen and (max-width:767px) { #obtn .ProThemeInfo{margin:35px 0 40px 0;} #obtn .ProThemeInfo .ProThemeText .p1{font-size: 14px; line-height: 24px; margin-top: 10px;} #obtn .ProThemeInfo .ProThemeText .more{margin-top: 15px;} #obtn .ProThemeInfo .ProThemeText .more a{width:160px; height: 40px; line-height: 40px;} #obtn .ProThemeInfo .ProThemeImg{margin-top: 20px;} } #obtn .themeFunDisplayBox{float: left; width: 100%; background: #22305c; position:relative;} #obtn .themeFunDisplayBg{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity: 0.15;filter:alpha(opacity=15);} #obtn .themeFunDisInfo{float: left; width: 100%; margin: 60px 0 50px 0; position: relative; z-index: 2;} #obtn .themeFunDisInfo .pageTit{color:#fff;} #obtn .themeFunDisList{float: left; width: 100%; margin-top: 30px;} #obtn .themeFunDisList li{float: left; width: 25%; text-align: center; margin-top: 20px;} #obtn .themeFunDisList li .tIco{float: left; width: 100%; line-height: 0;} #obtn .themeFunDisList li .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .themeFunDisList li:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .themeFunDisList li .dText{float: left; width: 100%; color:#fff; margin-top: 25px; font-size: 15px; line-height: 30px; height: 90px;} #obtn .themeFunDisList li .dText span{display: block;} #obtn .themeFunMore{float: left; width: 100%; margin-top: 33px; display: block; text-align:center;} #obtn .themeFunMore a{display: inline-block; width: 180px; height: 50px; border:2px solid #ffffff; line-height: 46px; color:#fff; font-size: 16px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .themeFunMore a:hover{background: #fff; color:#58d498;} @media screen and (max-width:1023px) { #obtn .themeFunDisInfo{margin:50px 0;} #obtn .themeFunDisList{margin-top: 20px;} #obtn .themeFunDisList li .tIco img{width:50px; height: 50px;} #obtn .themeFunDisList li .dText{margin-top: 15px; font-size: 15px;} #obtn .themeFunMore{margin-top: 20px;} } @media screen and (max-width:767px) { #obtn .themeFunDisInfo{margin:35px 0 40px 0;} #obtn .themeFunDisList{margin-top: 10px;} #obtn .themeFunDisList li{width: 50%; margin-top: 15px;} #obtn .themeFunDisList li .tIco img{width: 40px; height: 40px;} #obtn .themeFunDisList li .dText{margin-top: 10px; font-size: 14px; line-height: 24px; height: 72px;} #obtn .themeFunMore{margin-top: 10px;} #obtn .themeFunMore a{width: 160px; height: 40px; line-height: 36px; font-size: 16px;} } #obtn .superAdvBox{float: left; width: 100%; background:#e8ecf6; background: -moz-linear-gradient(top, #fff 0%, #e8ecf6 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#e8ecf6)); background: -webkit-linear-gradient(top, #fff 0%,#e8ecf6 100%); background: -o-linear-gradient(top, #fff 0%,#e8ecf6 100%); background: -ms-linear-gradient(top, #fff 0%,#e8ecf6 100%); background: linear-gradient(to bottom, #fff 0%,#e8ecf6 100%); } #obtn .superAdvInfo{float: left; width: 100%; margin: 97px 0 110px 0;} #obtn .superAdvList{float: left; width: 100%; margin-top: 60px;} #obtn .superAdvList ul{margin: 0 -26px;} #obtn .superAdvList li{float: left; width:25%; padding: 0 26px; margin-top:25px;} #obtn .superAdvList li .li3{float: left; width: 100%; background: #fff; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; box-shadow: 0 0 27px rgba(152,160,179,0.3); -moz-box-shadow: 0 0 27px rgba(152,160,179,0.3); -webkit-box-shadow: 0 0 27px rgba(152,160,179,0.3); } #obtn .superAdvList li .li3:hover{ box-shadow: 0 0 30px rgba(152,160,179,0.5); -moz-box-shadow: 0 0 30px rgba(152,160,179,0.5); -webkit-box-shadow: 0 0 30px rgba(152,160,179,0.5); } #obtn .superAdvList li .li3 .tIco{float: left; width: 100%; line-height: 0; margin-top:55px; text-align: center;} #obtn .superAdvList li .li3 .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .superAdvList li .li3:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .superAdvList li .li3 h3{float: left; width: 100%; text-align: center; color:#444444; font-size:18px; line-height: 35px; padding-bottom: 12px; position: relative; margin-top:30px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .superAdvList li .li3:hover h3{color:#58d498;} #obtn .superAdvList li .li3 h3:after{position: absolute; content: ''; width: 30px; height: 2px; left: 50%; margin-left: -15px; bottom: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .superAdvList li .li3:hover h3:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .superAdvList li .li3 .dText{float: left; width: 100%; text-align: center; color:#777777; font-size: 15px; line-height: 30px; padding: 0 30px; margin-top:18px; margin-bottom:45px; height:120px;} @media screen and (max-width:1229px) { #obtn .superAdvInfo{margin:75px 0 90px 0} #obtn .superAdvList{margin-top: 30px;} #obtn .superAdvList ul{margin:0 -15px;} #obtn .superAdvList li{padding: 0 15px;} #obtn .superAdvList li .li3 .dText{padding: 0 20px; font-size: 15px;} } @media screen and (max-width:1023px) { #obtn .superAdvInfo{margin:65px 0 70px 0} #obtn .superAdvList{margin-top: 20px;} #obtn .superAdvList li{width: 50%;} } @media screen and (max-width:767px) { #obtn .superAdvInfo{margin:35px 0 40px 0} #obtn .superAdvList{margin-top: 10px;} #obtn .superAdvList li{width: 100%; margin-top: 15px;} #obtn .superAdvList li .li3 .tIco{margin-top: 20px;} #obtn .superAdvList li .li3 .tIco img{width: 45px; height: 45px;} #obtn .superAdvList li .li3 h3{margin-top: 10px;} #obtn .superAdvList li .li3 .dText{margin: 15px 0 20px 0; font-size: 14px; line-height: 26px; height: auto;} } #obtn .iBanner.cloudBanner.servicesBan{ background: #8291f3; background: -webkit-linear-gradient(left,#58b9ff,#8291f3); background: -o-linear-gradient(left,#58b9ff,#8291f3); background: -moz-linear-gradient(left,#58b9ff,#8291f3); background: -ms-linear-gradient(left,#58b9ff,#8291f3); background: linear-gradient(to right,#58b9ff,#8291f3); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#58b9ff), color-stop(100%,#8291f3)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58b9ff', endColorstr='#8291f3',GradientType=0); } #obtn .iBanner.cloudBanner.servicesBan .box { /***opacity: 0.1;****/ filter: alpha(opacity=10); } #obtn .servicesVariousWays{float: left; width: 100%; margin: 97px 0 84px 0;} #obtn .servicesVariousWays .p1{float: left; width: 100%; text-align: center; color:#777777; font-size: 15px; line-height: 30px; margin: 20px 0 70px 0;} #obtn .servicesVarList{float: left; width: 100%;} #obtn .servicesVarList ul{margin:0 -60px;} #obtn .servicesVarList li{float: left; width: 25%; padding: 0 60px; line-height: 0; text-align: center;} #obtn .servicesVarList li img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .servicesVarList li img:hover{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } @media screen and (max-width:1229px) { #obtn .servicesVariousWays{margin: 70px 0 75px 0;} #obtn .servicesVariousWays .p1{margin: 20px 0 50px 0;} } @media screen and (max-width:1023px) { #obtn .servicesVariousWays{margin:60px 0 65px 0;} #obtn .servicesVariousWays .p1{margin: 15px 0 30px 0;} #obtn .servicesVarList ul{margin: 0 -35px;} #obtn .servicesVarList li{padding: 0 35px;} } @media screen and (max-width:767px) { #obtn .servicesVariousWays{margin:35px 0 40px 0;} #obtn .servicesVariousWays .p1{margin: 10px 0 5px 0;font-size: 14px;line-height: 26px;} #obtn .servicesVarList li{width: 50%;margin-top: 15px;} } #obtn .IndoorIntegBox{float: left; width: 100%; background: #f5f7fc; padding: 80px 0 65px 0;} #obtn .IndoorIntegBox .IndoorIntegImg{float: left; width:62.5%; margin-left: -90px;} #obtn .IndoorIntegBox .IndoorIntegText{float: right; width: 35.5%; height: 350px; display: table;} #obtn .IndoorIntegBox .IndoorIntegText .table{display: table-cell; vertical-align: middle;} #obtn .IndoorIntegBox .IndoorIntegText .pageTit{text-align: left;} #obtn .IndoorIntegBox .IndoorIntegText .p2{float: left; width: 100%; color:#777777; font-size: 15px; line-height: 30px; margin-top: 10px; padding-right: 70px;} @media screen and (max-width:1229px) { #obtn .IndoorIntegBox .IndoorIntegImg{margin-left: -70px;} #obtn .IndoorIntegBox .IndoorIntegText{height: 290px;} #obtn .IndoorIntegBox .IndoorIntegText .p2{padding-right: 30px;} } @media screen and (max-width:1023px) { #obtn .IndoorIntegBox{padding: 45px 0 50px 0;} #obtn .IndoorIntegBox .IndoorIntegImg{width: 100%; margin-left: 0;} #obtn .IndoorIntegBox .IndoorIntegText{width: 100%; height: auto; margin-top: 20px;} #obtn .IndoorIntegBox .IndoorIntegText .p2{padding-right: 0;} } @media screen and (max-width:767px) { #obtn .IndoorIntegBox{padding:40px 0;} #obtn .IndoorIntegBox .IndoorIntegText{margin-top: 10px;} #obtn .IndoorIntegBox .IndoorIntegText .p2{font-size: 14px; line-height: 26px;} } #obtn .NavExperienceBox{float: left; width: 100%; margin: 60px 0 40px 0;} #obtn .NavExperienceImg{float:right; width: 53.5%;} #obtn .NavExperienceText{float: left; width: 37%; padding-left: 85px; height: 520px; display: table;} #obtn .NavExperienceText .table{display: table-cell; vertical-align: middle;} #obtn .NavExperienceText .pageTit{text-align: left;} #obtn .NavExperienceText .p2{float: left; width: 100%; color:#777777; font-size: 15px; line-height: 30px; margin-top: 10px;} @media screen and (max-width:1229px) { #obtn .NavExperienceText{ padding-left: 55px; height:432px;} } @media screen and (max-width:1023px) { #obtn .NavExperienceBox{ margin:50px 0 40px 0;} #obtn .NavExperienceText{ padding-left:0; height:auto; width: 100%;} #obtn .NavExperienceImg{width: 100%; text-align: center;} } @media screen and (max-width:767px) { #obtn .NavExperienceBox{ margin:40px 0;} #obtn .NavExperienceText{margin-top: 10px;} #obtn .NavExperienceText .p2{font-size: 14px; line-height: 26px;} } #obtn .superAdvInfo.MoreFeatures{margin: 100px 0 110px 0;} #obtn .superAdvInfo.MoreFeatures .superAdvList{margin-top: 40px;} #obtn .superAdvInfo.MoreFeatures .superAdvList ul{margin: 0 -14px;} #obtn .superAdvInfo.MoreFeatures .superAdvList li{padding: 0 14px;} @media screen and (max-width:1229px) { #obtn .superAdvInfo.MoreFeatures{margin: 80px 0 90px 0} } @media screen and (max-width:1023px) { #obtn .superAdvInfo.MoreFeatures{margin: 65px 0 80px 0} } @media screen and (max-width:767px) { #obtn .superAdvInfo.MoreFeatures{margin: 35px 0 40px 0} #obtn .superAdvInfo.MoreFeatures .superAdvList{margin-top: 10px;} } #obtn .BottomConBox.serviceValue{ background: #8291f3; background: -webkit-linear-gradient(left,#58b9ff,#8291f3); background: -o-linear-gradient(left,#58b9ff,#8291f3); background: -moz-linear-gradient(left,#58b9ff,#8291f3); background: -ms-linear-gradient(left,#58b9ff,#8291f3); background: linear-gradient(to right,#58b9ff,#8291f3); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#58b9ff), color-stop(100%,#8291f3)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58b9ff', endColorstr='#8291f3',GradientType=0); } #obtn .BottomConBox.serviceValue .BottomConBg{opacity: 0.1;filter: alpha(opacity=10);} /*企业服务-数据制作服务*/ #obtn .DataFabricationBox{float: left; width:100%; background: #f7f8fc; padding: 40px 0 33px 0;} #obtn .DataFabricList{float: left; width: 100%;} #obtn .DataFabricList li{float: left; width: 20%;position: relative;} #obtn .DataFabricList li:after{position: absolute; content: ''; width: 2px; height: 144px; top:50%; margin-top: -72px; right: 0; background: #e8eaee;} #obtn .DataFabricList li:last-child:after{width: 0;} #obtn .DataFabricList li .tImg{float: left; width: 100%; text-align:center; line-height: 0; } /*修改20200904-----------------------------------------------------------*/ #obtn .DataFabricList li .tImg img{ /*transition: all 0.5s linear;*/ /*-moz-transition: all 0.5s linear;*/ /*-webkit-transition: all 0.5s linear;*/ /*-o-transition: all 0.5s linear;*/ } #obtn .DataFabricList li .dText{float: left; width: 100%; color:#444444; font-size: 15px; line-height: 30px; margin-top: 24px; height: 120px; text-align: center;} #obtn .DataFabricList li .dText span{display: block;} #obtn .DataFabricList li:hover .tImg img{ -webkit-transition: 1s ease; -moz-transition: 1s ease; -ms-transition: 1s ease; -o-transition: 1s ease; transition: 1s ease; transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } /*修改20200904-----------------------------------------------------------*/ @media screen and (max-width:1229px) { #obtn .DataFabricationBox{padding: 30px 0 23px 0;} #obtn .DataFabricList li:after{ height: 134px; margin-top:-67px;} #obtn .DataFabricList li .dText{margin-top: 15px; font-size: 15px; line-height: 26px; height: 104px;} #obtn .DataFabricList li .tImg img{width: 55px; height: 55px;} } @media screen and (max-width:1023px) { #obtn .DataFabricationBox{padding:20px 0 13px 0} #obtn .DataFabricList li:after{ height: 100px; margin-top: -50px;} #obtn .DataFabricList li .tImg img{width: 45px; height: 45px;} #obtn .DataFabricList li .dText{margin-top: 10px; font-size: 14px; line-height: 24px; height: 96px;} } @media screen and (max-width:767px) { #obtn .DataFabricationBox{padding:0;} #obtn .DataFabricList li{width: 100%; padding:15px 0 15px 60px; position: relative; border-bottom: 1px solid #e8eaee; } #obtn .DataFabricList li:after{width: 0;} #obtn .DataFabricList li .tImg{position: absolute; left: 0; width: 40px; height: 40px; top:50%; margin-top: -20px;} #obtn .DataFabricList li .tImg img{width: 40px; height: 40px;} #obtn .DataFabricList li .dText{height: auto; text-align: left; margin-top: 0;} #obtn .DataFabricList li .dText span{display: inline-block;} } #obtn .MapApplicationBox{float: left; width: 100%; margin: 55px 0 50px 0;} #obtn .MapApplicationImg{float: left; width: 100%; text-align: center; line-height: 0; margin-top: 53px;} #obtn .MapAppList{float: left; width: 80%; margin:-164px 4% 0 6%; background: #fff; padding-bottom: 17px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; box-shadow: 0 0 13px rgba(120,131,144,0.3); -moz-box-shadow: 0 0 13px rgba(120,131,144,0.3); -webkit-box-shadow: 0 0 13px rgba(120,131,144,0.3); } #obtn .MapAppList ul{float: left; width: 100%;} #obtn .MapAppList li{float: left; width:16.666%; margin-top: 32px;} #obtn .MapAppList li .tIco{float: left; width: 100%; text-align: center; line-height: 0;} #obtn .MapAppList li .tIco img{height: 36px;} #obtn .MapAppList li:hover img{-webkit-transition: 1s ease; -moz-transition: 1s ease; -ms-transition: 1s ease; -o-transition: 1s ease; transition: 1s ease; -webkit-transform: rotateY(360deg); -moz-transform: rotateY(360deg); -ms-transform: rotateY(360deg); -o-transform: rotateY(360deg); transform: rotateY(360deg);} #obtn .MapAppList li .dText{float: left; width: 100%; margin-top: 8px; color:#444444; font-size: 16px; line-height: 30px; text-align:center;} @media screen and (max-width:1229px) { #obtn .MapApplicationBox{margin: 85px 0 100px 0;} #obtn .MapApplicationImg{margin-top: 45px;} #obtn .MapAppList{width: 70%; margin:-150px 15% 0 15%} } @media screen and (max-width:1023px) { #obtn .MapApplicationBox{margin:65px 0 70px 0;} #obtn .MapApplicationImg{margin-top: 30px;} #obtn .MapAppList{width: 90%; margin:-100px 5% 0 5%} #obtn .MapAppList li .tIco img{width: 50px;} #obtn .MapAppList li .dText{font-size: 15px;} } @media screen and (max-width:767px) { #obtn .MapApplicationBox{margin:35px 0 40px 0;} #obtn .MapApplicationImg{margin-top: 25px;} #obtn .MapAppList{width: 100%; margin:20px 0 0 0; padding: 0 10px 10px 10px;} #obtn .MapAppList li{margin-top: 15px; width: 33.3333%; padding: 0 5px;} #obtn .MapAppList li .tIco img{width: 40px;height: 40px;} #obtn .MapAppList li .dText{font-size: 14px; line-height: 24px; height: 48px;} } #obtn .MapDisplayBox{float: left; width: 100%; } #obtn .MapDisplayInfo{float: left; width: 100%;margin: 68px 0;} #obtn .MapDisplayList{float: left; width: 100%; margin-top: 45px;} #obtn .MapDisplayList .MapDisplayHd{float: left; width: 100%; background: #485d86; height: 80px;} #obtn .MapDisplayList .MapDisplayHd ul{float: left; width: 100%; padding: 16px 0 18px 0; display: block; text-align: center;} #obtn .MapDisplayList .MapDisplayHd li{display: inline-block; width: 132px; color:#ffffff; font-size: 20px; line-height: 46px; margin: 0 13px; cursor: pointer; position: relative;} #obtn .MapDisplayList .MapDisplayHd li:after{position: absolute; content:''; width: 0; height: 55px; left:50%; top:0; background: url('_im_g/cloud69.png') no-repeat center; transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; } #obtn .MapDisplayList .MapDisplayHd li span{float: left; width: 100%;position: relative; z-index: 2;} #obtn .MapDisplayList .MapDisplayHd li.active:after, #obtn .MapDisplayList .MapDisplayHd li:hover:after{ width: 100%; left: 0;} #obtn .MapDisplayList .MapDisplayBd{float: left; width: 100%; position: relative;} #obtn .MapDisplayList .MapDisplayBd .ulBox{float: left; width: 100%; position: absolute; z-index: 1; opacity: 0;filter: alpha(opacity=0);} #obtn .MapDisplayList .MapDisplayBd .ulBox.active{position: relative; z-index: 3;opacity: 1;filter: alpha(opacity=100);} #obtn .MapDisplayList .MapDisplayBd .MapDisplayImg{float: left; width: 100%;} #obtn .MapDisplayBd .MapDisplayImg .ImgBox{float: left; width: 100%; line-height: 0;} #obtn .MapDisplayBd .MapDisplayIco{float: left; position: absolute; width: 166px; left: 20px; top:31px;} #obtn .MapDisplayBd .MapDisplayIco .slick-list{padding-right: 6px;} #obtn .MapDisplayBd .MapDisplayIco .slick-track{float: left;width: 160px; background: #0a1842; background: rgba(10,24,66,0.5); } #obtn .MapDisplayBd .MapDisplayIco .liIn{float: left; width: 100%; height: 51px; line-height: 51px; color:#fff; text-align: center; font-size:20px; margin:11px 0; cursor: pointer; position: relative; transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; } #obtn .MapDisplayBd .MapDisplayIco .liIn:after{position: absolute; content: ''; right: -6px; top:50%; margin-top:-6px; opacity: 0;filter: alpha(opacity=0); width: 0; height: 0; border-top:6px solid transparent; border-left:6px solid #8291f3; border-bottom:6px solid transparent; } #obtn .MapDisplayBd .MapDisplayIco .slick-slide.slick-current.slick-active .liIn, #obtn .MapDisplayBd .MapDisplayIco .liIn:hover{ background: #58b9ff; background: -webkit-linear-gradient(left,#58b9ff,#8291f3); background: -o-linear-gradient(left,#58b9ff,#8291f3); background: -moz-linear-gradient(left,#58b9ff,#8291f3); background: -ms-linear-gradient(left,#58b9ff,#8291f3); background: linear-gradient(to right,#58b9ff,#8291f3); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#58b9ff), color-stop(100%,#8291f3)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58b9ff', endColorstr='#8291f3',GradientType=0); } #obtn .MapDisplayBd .MapDisplayIco .slick-slide.slick-current.slick-active .liIn:after, #obtn .MapDisplayBd .MapDisplayIco .liIn:hover:after{ opacity:1;filter: alpha(opacity=100); } @media screen and (max-width:1229px) { #obtn .MapDisplayList .MapDisplayHd li{font-size: 18px;} #obtn .MapDisplayBd .MapDisplayIco .liIn{font-size: 18px; line-height: 45px; height: 45px; margin: 8px 0;} } @media screen and (max-width:1023px) { #obtn .MapDisplayInfo{margin: 60px 0;} #obtn .MapDisplayList{margin-top: 35px;} #obtn .MapDisplayList .MapDisplayHd{height: 70px;} #obtn .MapDisplayList .MapDisplayHd ul{padding: 10px 0;} #obtn .MapDisplayList .MapDisplayHd li{margin: 0 5px;} #obtn .MapDisplayBd .MapDisplayIco{width: 156px;} #obtn .MapDisplayBd .MapDisplayIco .slick-track{width: 150px;} #obtn .MapDisplayBd .MapDisplayIco .liIn{font-size: 16px; line-height: 40px;height: 40px;} } @media screen and (max-width:767px) { #obtn .MapDisplayInfo{margin:35px 0 40px 0;} #obtn .MapDisplayList{margin-top: 25px;} #obtn .MapDisplayList .MapDisplayHd{height: 60px;} #obtn .MapDisplayList .MapDisplayHd li{font-size: 16px; width:auto; line-height: 40px; padding: 0 8px; margin: 0;} #obtn .MapDisplayList .MapDisplayHd li:after{ height:48px; background: url('_im_g/cloud69.png') no-repeat center; background-size: cover;} #obtn .MapDisplayBd .MapDisplayIco{width: 100%;position: static;top:0; left: 0;} #obtn .MapDisplayBd .MapDisplayIco .liIn{margin: 0; height: 45px; line-height: 45px;} #obtn .MapDisplayBd .MapDisplayIco .liIn:after{display: none;} } #obtn .MapDisplayMore{float: left; width: 100%; margin-top: 50px; display: block; text-align: center;} #obtn .MapDisplayMore a{display: inline-block; width: 180px; height: 50px; border:2px solid #7a9deb; border:2px solid rgba(122,157,235,0.6); font-size: 16px; color:#7a9deb; line-height: 46px; margin: 0 20px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .MapDisplayMore a:first-child{background: #7a9deb; color:#fff;} #obtn .MapDisplayMore a:hover{background:#7a9deb;color:#fff; box-shadow:0 0 15px rgba(122,157,235,0.6); } @media screen and (max-width:1023px) { #obtn .MapDisplayMore{margin-top: 40px} } @media screen and (max-width:767px) { #obtn .MapDisplayMore{margin-top:25px} #obtn .MapDisplayMore a{width: 150px; height: 40px; line-height: 36px; margin: 0 5px;} } #obtn .CartoMethodInfo{float: left; width: 100%; margin: 98px 0 130px 0;} #obtn .CartoMethodList{float: left; width: 100%; margin-top:82px;} #obtn .CartoMethodList li{float: left; width: 45%; transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; } #obtn .CartoMethodList li:last-child{float: right;} #obtn .CartoMethodList li .tImg{float: left; width: 100%; height: 200px; position: relative;line-height: 200px; text-align: center;} #obtn .CartoMethodList li .tImg:after{position: absolute; content: ''; width: 100%; height: 100%; background: #324899; left: 0; top:0; opacity: 0.6;filter: alpha(opacity=60);} #obtn .CartoMethodList li .tImg img{position: relative; z-index: 3; vertical-align: middle; margin-top:-8px; transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; } #obtn .CartoMethodList li:hover .tImg img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .CartoMethodList li:hover{ box-shadow: 0 0 15px rgba(0,0,0,0.1); -moz-box-shadow: 0 0 15px rgba(0,0,0,0.1); -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.1); } #obtn .CartoMethodList li .dText{float: left; width: 100%; background: #f7f8fc; padding: 37px 20px 24px 20px;} #obtn .CartoMethodList li .dText h4{float: left; width: 100%; color:#444444; font-size: 22px; line-height: 40px; text-align:center; padding-bottom: 10px; position:relative;} #obtn .CartoMethodList li .dText h4:after{position: absolute; content: ''; width: 30px; height: 2px; left: 50%; margin-left: -15px; bottom: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .CartoMethodList li:hover .dText h4:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .CartoMethodList li .dText .p1{float: left; width: 100%; padding: 0 20%; color:#777777; font-size: 15px; line-height: 30px; text-align:center; margin-top: 18px; height: 90px;} #obtn .CartoMethodList li .dText .makeMore{float: left; width: 100%; margin-top: 12px; display: block; text-align:center;} #obtn .CartoMethodList li .dText .makeMore a{display: inline-block; width: 180px; height: 50px; color:#fff; background: #7a9deb; font-size: 18px; line-height: 50px; position: relative; border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;} #obtn .CartoMethodList li .dText .makeMore a:before { content: '';position: absolute;top: -20px;left: -20px;bottom: -20px;right: -20px;background: inherit;border-radius: 50px;z-index: -1;opacity: 0.4; -webkit-transform: scale3d(0.8, 0.5, 1); -moz-transform: scale3d(0.8, 0.5, 1); -o-transform: scale3d(0.8, 0.5, 1); transform: scale3d(0.8, 0.5, 1); } #obtn .CartoMethodList li .dText .makeMore a:hover { -webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s; transition: background-color 0.1s 0.3s, color 0.1s 0.3s; color: #fff; background-color: #58d498; -webkit-animation: anim-moema-1 0.3s forwards; -moz-animation: anim-moema-1 0.3s forwards; -o-animation: anim-moema-1 0.3s forwards; animation: anim-moema-1 0.3s forwards; } #obtn .CartoMethodList li .dText .makeMore a:hover:before { -webkit-animation: anim-moema-2 0.3s 0.3s forwards; -moz-animation: anim-moema-2 0.3s 0.3s forwards; -o-animation: anim-moema-2 0.3s 0.3s forwards; animation: anim-moema-2 0.3s 0.3s forwards; } @media screen and (max-width:1229px) { #obtn .CartoMethodInfo{ margin: 80px 0 100px 0;} #obtn .CartoMethodList{margin-top:60px;} #obtn .CartoMethodList li .dText .p1{padding: 0 10%;} } @media screen and (max-width:1023px) { #obtn .CartoMethodInfo{ margin:60px 0 70px 0;} #obtn .CartoMethodList{margin-top:40px;} #obtn .CartoMethodList li .dText .p1{padding: 0;} #obtn .CartoMethodList li .tImg{height: 150px; line-height: 150px;} #obtn .CartoMethodList li .tImg img{width: 80px; height: 80px;} #obtn .CartoMethodList li .dText{padding:20px 20px 24px 20px} #obtn .CartoMethodList li .dText h4{font-size: 18px;} #obtn .CartoMethodList li .dText .p1{font-size: 15px; margin-top: 15px;} } @media screen and (max-width:767px) { #obtn .CartoMethodInfo{ margin:35px 0 40px 0;} #obtn .CartoMethodList{margin-top:10px;} #obtn .CartoMethodList li{margin-top: 15px; width: 100%;} #obtn .CartoMethodList li .tImg{ height: 120px; line-height: 120px;} #obtn .CartoMethodList li .tImg img{width: 70px; height: 70px;} #obtn .CartoMethodList li .dText .p1{font-size: 14px; line-height: 26px; height:78px;} #obtn .CartoMethodList li .dText .makeMore a{font-size: 16px; width: 160px; height: 40px; line-height: 40px;} } #obtn .SystemAppBox{float: left; width: 100%; margin: 80px 0 130px 0;} #obtn .SystemAppList{float: left; width: 100%; margin-top: 85px;} #obtn .SystemAppHd{float: left; width: 55.8%;} #obtn .SystemAppHd ul{margin-top: -30px;} #obtn .SystemAppHd li{float: left; width: 100%; margin-top: 30px; padding:0 70px 0 100px; position: relative; background: #fff; box-shadow: 0 0 18px rgba(208,208,208,0.3); -moz-box-shadow: 0 0 18px rgba(208,208,208,0.3); -webkit-box-shadow: 0 0 18px rgba(208,208,208,0.3); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .SystemAppHd li.on, #obtn .SystemAppHd li:hover{ box-shadow: 0 0 25px rgba(208,208,208,0.5); -moz-box-shadow: 0 0 25px rgba(208,208,208,0.5); -webkit-box-shadow: 0 0 25px rgba(208,208,208,0.5); } #obtn .SystemAppHd li span{position: absolute; left:30px; top:38px; line-height: 0; width: 50px; height: 50px;} #obtn .SystemAppHd li span img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .SystemAppHd li:hover span img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .SystemAppHd li h4{float: left; width: 100%; margin-top: 30px; color:#444444; font-size: 18px; font-weight: bold; line-height: 35px; padding-bottom: 12px; position: relative; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .SystemAppHd li.on h4, #obtn .SystemAppHd li:hover h4{color:#58d498} #obtn .SystemAppHd li .pBox{float: left; width: 100%; color:#777777; font-size: 15px; line-height: 30px; margin-top: 19px; padding-bottom: 24px;} #obtn .SystemAppHd li h4:after{position: absolute; content: ''; width: 30px; height: 2px; left:0; bottom: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .SystemAppHd li:hover h4:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .SystemAppBd{float: right; width: 37.5%;} #obtn .SystemAppBd li{float: left; width: 100%; height:600px; background: #a7bdfa; position:relative;} #obtn .SystemAppBd li .boxImg{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity: 0.1;filter: alpha(opacity=10);} #obtn .SystemAppBd li .sysImgBox{position: absolute; width: 110%; left: -56px; line-height: 600px; top:0;} #obtn .SystemAppBd li .sysImgBox img{vertical-align: middle; margin-top: -10px;} @media screen and (max-width:1229px) { #obtn .SystemAppBox{margin:70px 0 100px 0;} #obtn .SystemAppList{margin-top: 60px;} #obtn .SystemAppHd li{padding: 0 40px 0 70px;} #obtn .SystemAppHd li span{left: 10px;top: 28px;} #obtn .SystemAppHd li h4{margin-top:20px;} #obtn .SystemAppHd li .pBox{font-size: 15px; line-height: 26px;margin-top: 10px;padding-bottom: 20px;} #obtn .SystemAppBd li{height: 507px;} #obtn .SystemAppBd li .sysImgBox{line-height: 507px;} } @media screen and (max-width:1023px) { #obtn .SystemAppBox{margin:60px 0 70px 0;} #obtn .SystemAppList{margin-top: 15px;} #obtn .SystemAppHd{width: 100%;} #obtn .SystemAppHd ul{margin-top: 0;} #obtn .SystemAppHd li{margin-top: 20px;} #obtn .SystemAppBd{width: 100%;} #obtn .SystemAppBd li{height: auto; padding:20px;margin-top:20px;} #obtn .SystemAppBd li .sysImgBox{position: relative; z-index: 2; float: left; width: 100%; left: 0; height: auto; line-height: 0;} #obtn .SystemAppBd li .sysImgBox img{width: 100%; margin-top: 0;} } @media screen and (max-width:767px) { #obtn .SystemAppBox{margin:35px 0 40px 0;} #obtn .SystemAppList{margin-top: 10px;} #obtn .SystemAppHd li{padding:0 20px 0 60px; margin-top: 15px;} #obtn .SystemAppHd li span{width: 40px; height: 40px;} #obtn .SystemAppHd li span img{width: 40px;} #obtn .SystemAppHd li h4{font-size: 18px;} #obtn .SystemAppHd li .pBox{font-size: 14px; line-height: 24px;} } #obtn .SystemAdvantagesBox{float: left; width: 100%; background: #2e4068; position: relative} #obtn .SystemAdvantagesBg{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity:0.1;filter: alpha(opacity=10);} #obtn .SystemAdvantagesInfo{float: left; width: 100%; margin: 115px 0 165px 0; position: relative; z-index: 2;} #obtn .SystemAdvantagesInfo .pageTit{color:#fff;} #obtn .SystemAdvantagesList{float: left; width: 100%; margin-top: 98px;} #obtn .SystemAdvantagesList ul{margin: 0 -13px;} #obtn .SystemAdvantagesList li{float: left; width: 25%; padding: 0 13px;} #obtn .SystemAdvantagesList li .SysText{float: left; width: 100%; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .SystemAdvantagesList li .SysText:hover{ box-shadow: 0 0 18px rgba(255,255,255,0.2); -moz-box-shadow: 0 0 18px rgba(255,255,255,0.2); -webkit-box-shadow: 0 0 18px rgba(255,255,255,0.2); } #obtn .SystemAdvantagesList li .tH1{float: left; width: 100%; background: url("_im_g/cloud81.png") no-repeat center; background-size: cover; text-align:center; color:#fff; line-height: 68px; font-size: 16px;} #obtn .SystemAdvantagesList li .dText{float: left; width: 100%; background:#fff;} #obtn .SystemAdvantagesList li .dText .tIco{float: left; width: 100%; line-height: 0; margin-top: 45px; text-align: center;} #obtn .SystemAdvantagesList li .dText .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .SystemAdvantagesList li .SysText:hover .dText .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .SystemAdvantagesList li .dText .p2{float: left; width: 100%;margin: 28px 0 39px 0; color:#777777; font-size: 15px; line-height: 30px; padding: 0 25px; height: 120px;} @media screen and (max-width:1229px) { #obtn .SystemAdvantagesInfo{margin: 85px 0 125px 0} #obtn .SystemAdvantagesList{margin-top:60px;} #obtn .SystemAdvantagesList li .dText .tIco{margin-top: 35px;} #obtn .SystemAdvantagesList li .dText .p2{font-size: 15px; padding: 0 15px;} } @media screen and (max-width:1023px) { #obtn .SystemAdvantagesInfo{margin: 70px 0 80px 0;} #obtn .SystemAdvantagesList{margin-top: 30px;} #obtn .SystemAdvantagesList li{width: 50%; margin-top: 20px;} } @media screen and (max-width:767px) { #obtn .SystemAdvantagesInfo{margin: 35px 0 40px 0;} #obtn .SystemAdvantagesList{margin-top: 15px;} #obtn .SystemAdvantagesList li{width:100%; margin-top: 15px;} #obtn .SystemAdvantagesList li .dText .tIco{margin-top: 25px;} #obtn .SystemAdvantagesList li .dText .p2{height: auto; font-size: 14px; line-height: 24px;margin: 20px 0 25px 0;} } #obtn .CooperationFlowBox{float: left;width: 100%; margin: 100px 0 120px 0;} #obtn .CooperationFlowImg{float: left; width: 100%; line-height: 0; margin-top: 90px;} @media screen and (max-width:1229px) { #obtn .CooperationFlowBox{margin: 80px 0 100px 0;} #obtn .CooperationFlowImg{margin-top: 60px;} } @media screen and (max-width:1023px) { #obtn .CooperationFlowBox{margin: 65px 0 80px 0;} #obtn .CooperationFlowImg{margin-top: 45px;} } @media screen and (max-width:767px) { #obtn .CooperationFlowBox{margin: 35px 0 40px 0;} #obtn .CooperationFlowImg{margin-top: 25px;} } /*体验中心*/ #obtn .iBanner.expBanBox .box{opacity: 1;filter: alpha(opacity=100);} #obtn .expBanText{position: absolute; width: 100%; left: 0; color:#ffffff; font-size:40px; line-height: 60px; top:50%; margin-top: -30px;} @media screen and (max-width:1229px) { #obtn .expBanText{font-size: 46px;} } @media screen and (max-width:1023px) { #obtn .expBanText{font-size: 36px;} } @media screen and (max-width:767px) { #obtn .expBanText{font-size:28px;} } #obtn .slideBox.experienceSid{background: #f5f7fb;} #obtn .slideBox.experienceSid .pz_SideLayer li{width: 25%; position: relative} #obtn .slideBox.experienceSid .pz_SideLayer li:after{position: absolute; content: ''; width: 1px; height: 100%; right: 0; background: #e3e5e8;} #obtn .slideBox.experienceSid .pz_SideLayer li:last-child:after{width: 0;} #obtn .experienceSid .expSearch{float: right; width: 72%; height: 34px; background: #fff; border:1px solid #d9d9d9; margin: 18px 0; padding-right: 40px; position: relative; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .experienceSid .expSearch input{float: left; width: 100%; height: 32px; line-height: 32px; color:#333; font-size: 14px; text-indent: 12px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .experienceSid .expSearch button{position: absolute; width: 30px; height: 30px; line-height: 30px; text-align: center; right: 5px; top:1px;} #obtn .experienceSid .expSearch button img{vertical-align: middle; margin-top: -2px;} #obtn .slideBox.on .expSearch{ margin:8px 0;} @media screen and (max-width:1023px) { #obtn .experienceSid .expSearch{ width: 82%; margin: 13px 0;} } @media screen and (max-width:767px) { #obtn .slideBox.experienceSid .pz_SideLayer li{width: 33.3333%;} #obtn .slideBox.experienceSid .pz_SideLayer li:nth-child(3):after{width: 0;} #obtn .slideBox.experienceSid .pz_SideLayer li:last-child{width: 100%; padding: 0 15px; border-top:1px solid #d9d9d9;} #obtn .experienceSid .expSearch{width: 100%;} } #obtn .softwareBox{float: left; width:100%; margin: 69px 0 72px 0;} #obtn .softwareBox .pageTit1{float: left; width: 100%; padding-left: 19px; font-size: 20px; font-weight: bold; color:#444444; line-height: 50px; position: relative} #obtn .softwareBox .pageTit1:after{position: absolute; content: ''; width: 6px; height: 30px; left: 0; top:50%; margin-top: -15px; background: #58d398;} #obtn .softwareBox .softwareList{float: left; width: 100%; margin-top: 9px;} #obtn .softwareBox .softwareList ul{margin: 0 -10px;} #obtn .softwareBox .softwareList li{float: left; width: 25%; padding: 0 10px; margin-top: 21px; height: 245px;} #obtn .softwareBox .softwareList li a{float: left; width: 100%; background: #fff; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; box-shadow: 0 0 24px rgba(187,204,227,0.3); -moz-box-shadow: 0 0 24px rgba(187,204,227,0.3); -webkit-box-shadow: 0 0 24px rgba(187,204,227,0.3); } #obtn .softwareBox .softwareList li .tImg{float: left; width: 100%;line-height: 0; overflow: hidden; border-radius: 4px 4px 0 0; -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; } #obtn .softwareBox .softwareList li .tImg img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .softwareBox .softwareList li a:hover .tImg img{ transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1); } #obtn .softwareBox .softwareList li .dText{float: left; width: 100%; padding: 0 20px; margin: 21px 0 12px 0; font-size: 16px; color:#444444; line-height: 26px; height: 52px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:2; overflow: hidden; } #obtn .softwareBox .softwareList li a:hover{margin-top: -10px; box-shadow: 0 8px 13px rgba(156,173,195,0.3); -moz-box-shadow: 0 8px 13px rgba(156,173,195,0.3); -webkit-box-shadow: 0 8px 13px rgba(156,173,195,0.3); } @media screen and (max-width:1229px) { #obtn .softwareBox{margin:55px 0 60px 0} #obtn .softwareBox .softwareList li{margin-top:20px; height: 216px;} } @media screen and (max-width:1023px) { #obtn .softwareBox{margin:45px 0 50px 0} #obtn .softwareBox .pageTit1{font-size: 22px;} #obtn .softwareBox .pageTit1:after{width: 4px; height: 20px; margin-top: -10px;} #obtn .softwareBox .softwareList li{width: 33.3333%; height: 210px;} #obtn .softwareBox .softwareList li .dText{margin:15px 0 12px 0; font-size: 15px;} } @media screen and (max-width:767px) { #obtn .softwareBox{margin:35px 0 40px 0} #obtn .softwareBox .pageTit1{font-size: 18px; line-height: 40px;} #obtn .softwareBox .softwareList{margin-top: 5px;} #obtn .softwareBox .softwareList li{width: 50%; height: auto; margin-top: 15px;} #obtn .softwareBox .softwareList li a:hover{margin-top: 0;} #obtn .softwareBox .softwareList li .dText{font-size: 14px; line-height: 24px; height: 48px; padding: 0 15px;} } #obtn .MapEffBox{float:left; width: 100%; background: #f5f7fa;} /*体验中心-图片内页*/ #obtn .GNEECPageBg{float: left; width: 100%; background: #f5f7fb; margin-top: 75px;} #obtn .GNEECImgBox{float: left; width: 77%; margin-top: 30px; background: #fff; padding: 10px 10px 100px 10px;} #obtn .GNEECTopBig{float: left; width: 100%;} #obtn .GNEECTopBig .imgBox{float:left; width: 100%; line-height: 0;} #obtn .GNEECTextDown{float: left; width: 100%; margin-top: 30px;} #obtn .GNEECTextDown .GNEECUl{margin: 0 -7px;} #obtn .GNEECTextDown .smallImg{float: left; width: 100%; padding: 0 7px;} #obtn .GNEECTextDown .smallImg span{float: left; width: 100%; line-height: 0; position: relative; overflow: hidden; cursor: pointer; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .GNEECTextDown .smallImg span:after{position: absolute; content: ''; left: 0; top:0; width: 100%; height: 100%; background: #8a8a8a; opacity: 0.6;filter: alpha(opacity=60); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .GNEECTextDown .smallImg span:before{position: absolute; content: ''; left: 0; top:0; width: 100%; height: 100%; border:3px solid #58d398;opacity: 0; filter: alpha(opacity=0);} #obtn .GNEECTextDown .slick-slide.slick-current.slick-active span:after, #obtn .GNEECTextDown span:hover:after{opacity: 0; filter: alpha(opacity=0);} #obtn .GNEECTextDown .slick-slide.slick-current.slick-active span:before{ opacity:1; filter: alpha(opacity=100); } #obtn .GNEECTextDown .slick-prev, #obtn .GNEECTextDown .slick-next{width: 14px; height: 24px; left: 22px; background: url("_im_g/exp43.png") no-repeat center; opacity: 0.6;filter: alpha(opacity=60); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .GNEECTextDown .slick-next{background: url("_im_g/exp44.png") no-repeat center; left: auto; right: 22px;} #obtn .GNEECTextDown .slick-prev:hover, #obtn .GNEECTextDown .slick-next:hover{opacity:1;filter: alpha(opacity=100);} #obtn .rightOfficeBuild{float: right; width: 21%; margin: 30px 0 100px 0;} #obtn .rightOfficeBuild h3{float: left; width: 100%; color:#444444; font-size: 24px; line-height:45px; font-weight: 600;} #obtn .rightOfficeBuild .tableBox{float: left; width: 100%; margin-top: 16px; border:1px solid #d9d9d9; border-bottom: 0; background: #fff;} #obtn .rightOfficeBuild .tableBox dl{float: left; width: 100%; border-bottom: 1px solid #d9d9d9;} #obtn .rightOfficeBuild .tableBox dt{float: left; width: 34%; text-align: center; background: #e8ebf3; font-size: 16px; line-height:48px;} #obtn .rightOfficeBuild .tableBox dd{float: left; width: 64%; padding-left: 25px; color:#777777; font-size: 16px; font-weight: bold; line-height: 48px;} #obtn .rightOfficeBuild .RelatedCases{float: left; width: 100%; margin-top: 70px;} #obtn .rightOfficeBuild .RelatedCases .tH1{float: left; width: 100%; height: 50px; line-height: 50px; color:#fff; font-size: 18px; padding-left: 25px; font-weight: bold; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; background: #00b8f9; background: -webkit-linear-gradient(left,#00b8f9,#1aefb5); background: -o-linear-gradient(left,#00b8f9,#1aefb5); background: -moz-linear-gradient(left,#00b8f9,#1aefb5); background: -ms-linear-gradient(left,#00b8f9,#1aefb5); background: linear-gradient(to right,#00b8f9,#1aefb5); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#00b8f9), color-stop(100%,#1aefb5)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b8f9', endColorstr='#1aefb5',GradientType=0); } #obtn .rightOfficeBuild .RelatedCaseList{float: left; width: 100%; margin-top: 5px;} #obtn .rightOfficeBuild .RelatedCaseList li{float: left; width: 100%; margin-top: 20px;} #obtn .rightOfficeBuild .RelatedCaseList li a{float: left; width: 100%; background: #000; line-height: 0; overflow: hidden; position: relative; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .rightOfficeBuild .RelatedCaseList li a:hover{ box-shadow: 0 0 15px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 15px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.2); } #obtn .rightOfficeBuild .RelatedCaseList li a img{opacity: 0.5;filter: alpha(opacity=50); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn .rightOfficeBuild .RelatedCaseList li a:hover img{ -webkit-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1); } #obtn .rightOfficeBuild .RelatedCaseList li a span{position: absolute; left: 0; bottom:8px; width:100%; padding: 0 19px; color:#fff; font-size: 16px; line-height: 30px;} @media screen and (max-width:1399px) { #obtn .rightOfficeBuild h3{font-size: 20px; line-height: 40px;} #obtn .rightOfficeBuild .tableBox dt{font-size: 15px; line-height: 42px;} #obtn .rightOfficeBuild .tableBox dd{font-size: 15px; line-height: 42px; padding-left: 15px;} #obtn .rightOfficeBuild .RelatedCases{margin-top: 40px;} #obtn .rightOfficeBuild .RelatedCases .tH1{font-size: 16px; height: 45px; line-height: 45px; padding-left: 20px;} #obtn .rightOfficeBuild .RelatedCaseList li{margin-top: 15px;} } @media screen and (max-width:1229px) { #obtn .GNEECImgBox{width: 75%;padding: 10px 10px 60px 10px} #obtn .GNEECTextDown{margin-top: 20px;} #obtn .rightOfficeBuild{width: 23%;margin: 30px 0 70px 0;} #obtn .rightOfficeBuild h3{font-size: 18px;} #obtn .rightOfficeBuild .tableBox{margin-top: 12px;} #obtn .rightOfficeBuild .tableBox dt{font-size: 14px;} #obtn .rightOfficeBuild .tableBox dd{font-size: 14px;} #obtn .rightOfficeBuild .RelatedCases{margin-top: 30px;} #obtn .rightOfficeBuild .RelatedCaseList{margin-top: 0;} #obtn .rightOfficeBuild .RelatedCaseList li a span{font-size: 15px; line-height: 26px;} } @media screen and (max-width:1023px) { #obtn .GNEECPageBg{margin-top: 63px;} #obtn .GNEECImgBox{width: 100%; padding: 10px 10px 15px 10px} #obtn .GNEECTextDown{margin-top: 10px;} #obtn .rightOfficeBuild{width: 100%; margin: 20px 0 30px 0;} } /*体验中心-视频内页*/ #obtn .GNEECImgBox.video{padding: 10px;} #obtn .GNEECImgBox.video .GNEECTopBig video{float: left; width: 100%;} #obtn .RelatedCaseList li a em{position: absolute; z-index: 3; width: 38px; height: 38px; left: 50%; margin-left: -19px; top:50%; margin-top: -19px;} #obtn .RelatedCaseList li a em img{opacity:1!important;filter: alpha(opacity=100)!important;} /*云平台-三维地图引擎*/ #obtn ._3DMapPro{float: left; width: 100%; margin: 130px 0;} #obtn ._3DMapProBox{float: left; width: 100%; padding: 30px 50px 30px 30px; background:url(_im_g/yqbj.jpg) no-repeat center;; /*** background: -webkit-linear-gradient(left,#54c2ca,#53b6bd); background: -o-linear-gradient(left,#54c2ca,#53b6bd); background: -moz-linear-gradient(left,#54c2ca,#53b6bd); background: -ms-linear-gradient(left,#54c2ca,#53b6bd); background: linear-gradient(to right,#54c2ca,#53b6bd); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#54c2ca), color-stop(100%,#53b6bd)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#54c2ca', endColorstr='#53b6bd',GradientType=0);***/ } #obtn ._3DMapLeft{float: left; width: 54.5%;} #obtn ._3DMapLeft ._3DMapInfo{float: left; width: 100%; background: #f7f8fc; padding: 26px 30px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn ._3DMapLeft ._3DMapInfo:hover{ box-shadow: 0 0 15px rgba(0,0,0,0.1); -moz-box-shadow: 0 0 15px rgba(0,0,0,0.1); -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.1); } #obtn ._3DMapLeft ._3DMapInfo .pageTit{text-align: left;} #obtn ._3DMapLeft ._3DMapInfo .p1{float: left; width: 100%; margin-top: 9px; color:#444; font-size: 15px; line-height: 30px;} #obtn ._3DMapLeft ._3DMapInfo .moreBox{float: left; width: 100%; margin-top: 30px;} #obtn ._3DMapLeft ._3DMapInfo .moreBox a{float: left; width: 180px; height: 50px; color:#fff; font-size: 16px;line-height: 50px; text-align: center; background: #00d6ae; position: relative; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn ._3DMapLeft ._3DMapInfo .moreBox a:before { content: '';position: absolute;top: -20px;left: -20px;bottom: -20px;right: -20px;background: inherit;border-radius: 50px;z-index: -1;opacity: 0.4; -webkit-transform: scale3d(0.8, 0.5, 1); -moz-transform: scale3d(0.8, 0.5, 1); -o-transform: scale3d(0.8, 0.5, 1); transform: scale3d(0.8, 0.5, 1); } #obtn ._3DMapLeft ._3DMapInfo .moreBox a:hover { -webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s; transition: background-color 0.1s 0.3s, color 0.1s 0.3s; color: #fff; background-color: #58d498; -webkit-animation: anim-moema-1 0.3s forwards; -moz-animation: anim-moema-1 0.3s forwards; -o-animation: anim-moema-1 0.3s forwards; animation: anim-moema-1 0.3s forwards; } #obtn ._3DMapLeft ._3DMapInfo .moreBox a:hover:before { -webkit-animation: anim-moema-2 0.3s 0.3s forwards; -moz-animation: anim-moema-2 0.3s 0.3s forwards; -o-animation: anim-moema-2 0.3s 0.3s forwards; animation: anim-moema-2 0.3s 0.3s forwards; } #obtn ._3DMapLeft ._3DMapText{float: left; width: 100%; margin: 33px 0 29px 0; padding: 0 30px;color:#ffffff; font-size: 16px; line-height: 30px;} #obtn ._3DMapImg{float:right; width: 48%;} @media screen and (max-width:1229px) { #obtn ._3DMapPro{margin: 100px 0;} #obtn ._3DMapProBox{padding: 32px 30px 19px 30px} #obtn ._3DMapLeft ._3DMapInfo{padding: 15px 20px;} #obtn ._3DMapLeft ._3DMapInfo .p1{font-size: 15px;} #obtn ._3DMapLeft ._3DMapInfo .moreBox{margin-top: 20px;} #obtn ._3DMapLeft ._3DMapText{margin:20px 0; padding: 0 20px;} } @media screen and (max-width:1023px) { #obtn ._3DMapPro{margin: 80px 0;} #obtn ._3DMapProBox{padding:20px 20px 19px 20px} #obtn ._3DMapLeft{width: 100%;} #obtn ._3DMapImg{width: 100%; text-align: center;} } @media screen and (max-width:767px) { #obtn ._3DMapPro{margin:40px 0;} #obtn ._3DMapProBox{padding: 15px;} #obtn ._3DMapLeft ._3DMapInfo{padding: 15px;} #obtn ._3DMapLeft ._3DMapInfo .p1{font-size: 14px; line-height: 26px;} #obtn ._3DMapLeft ._3DMapInfo .moreBox{margin-top: 15px;} #obtn ._3DMapLeft ._3DMapInfo .moreBox a{width:160px; height: 40px; line-height: 40px;} #obtn ._3DMapLeft ._3DMapText{margin: 15px 0; padding: 0; font-size: 14px; line-height: 26px;} } #obtn ._3DMapAdvantageBox{float: left; width: 100%; background: #f5f7fb; position: relative;} #obtn ._3DMapAdvantageBg{float: left; position: absolute; left: 0; top:0; width: 100%; height:100%; opacity: 0.1;filter: alpha(opacity=10);} #obtn ._3DMapAdvantageInfo{float: left; width: 100%; margin: 107px 0 155px 0; position: relative; z-index: 2;} #obtn ._3DMapAdvantageList{float: left; width: 100%; margin-top: 85px;} #obtn ._3DMapAdvantageList ul{margin: 0 -12px;} #obtn ._3DMapAdvantageList li{float: left; width: 20%; padding: 0 12px;} #obtn ._3DMapAdvantageList li .li3{float: left; width: 100%; background: #fff; padding-bottom: 65px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; box-shadow: 0 0 27px rgba(152,160,179,0.3); -moz-box-shadow: 0 0 27px rgba(152,160,179,0.3); -webkit-box-shadow: 0 0 27px rgba(152,160,179,0.3); } #obtn ._3DMapAdvantageList li .li3:hover{ box-shadow: 0 0 30px rgba(152,160,179,0.5); -moz-box-shadow: 0 0 30px rgba(152,160,179,0.5); -webkit-box-shadow: 0 0 30px rgba(152,160,179,0.5); } #obtn ._3DMapAdvantageList li .li3 .tIco{float: left; width: 100%; line-height: 0; margin-top:55px; text-align: center;} #obtn ._3DMapAdvantageList li .li3 .tIco img{ transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn ._3DMapAdvantageList li .li3:hover .tIco img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn ._3DMapAdvantageList li .li3 h3{float: left; width: 100%; text-align: center; color:#444444; font-size:16px; line-height: 35px; padding-bottom: 12px; position: relative; margin-top:30px; transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn ._3DMapAdvantageList li .li3:hover h3{color:#58d498;} #obtn ._3DMapAdvantageList li .li3 h3:after{position: absolute; content: ''; width: 30px; height: 2px; left: 50%; margin-left: -15px; bottom: 0; background:#585f75; background: -webkit-linear-gradient(left,#585f75,#b9bfce); background: -o-linear-gradient(left,#585f75,#b9bfce); background: -moz-linear-gradient(left,#585f75,#b9bfce); background: -ms-linear-gradient(left,#585f75,#b9bfce); background: linear-gradient(to right,#585f75,#b9bfce); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#585f75), color-stop(100%,#b9bfce)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585f75', endColorstr='#b9bfce',GradientType=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; } #obtn ._3DMapAdvantageList li .li3:hover h3:after{ background:#0fe9b2; background: -webkit-linear-gradient(left,#04c0f0,#17e8be); background: -o-linear-gradient(left,#04c0f0,#17e8be); background: -moz-linear-gradient(left,#04c0f0,#17e8be); background: -ms-linear-gradient(left,#04c0f0,#17e8be); background: linear-gradient(to right,#04c0f0,#17e8be); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#04c0f0), color-stop(100%,#17e8be)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } @media screen and (max-width:1229px) { #obtn ._3DMapAdvantageInfo{margin: 85px 0 125px 0;} #obtn ._3DMapAdvantageList{margin-top: 55px;} } @media screen and (max-width:1023px) { #obtn ._3DMapAdvantageInfo{margin: 70px 0 100px 0;} #obtn ._3DMapAdvantageList{margin-top:20px;} #obtn ._3DMapAdvantageList li{width: 33.3333%; margin-top:20px;} } @media screen and (max-width:767px) { #obtn ._3DMapAdvantageInfo{margin:35px 0 40px 0;} #obtn ._3DMapAdvantageList{margin-top: 15px;} #obtn ._3DMapAdvantageList ul{margin:0 -5px;} #obtn ._3DMapAdvantageList li{width:50%; margin-top:15px; padding:0 5px;} #obtn ._3DMapAdvantageList li .li3{padding-bottom:40px} #obtn ._3DMapAdvantageList li .li3 .tIco{margin-top: 35px;} #obtn ._3DMapAdvantageList li .li3 .tIco img{width: 45px;} #obtn ._3DMapAdvantageList li .li3 h3{font-size: 16px; margin-top: 20px;} } #obtn ._3DMapFunctionBox{float: left; width: 100%; background: #222d47; position: relative} #obtn ._3DMapFunctionBg{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity: 0.4;filter: alpha(opacity=40);} #obtn ._3DMapFunctionInfo{float: left; width: 100%; position: relative; z-index: 2; margin: 68px 0 117px 0;} #obtn ._3DMapFunctionInfo .pageTit{color:#fff;} #obtn ._3DMapFunctionList{float: left; width: 100%; margin-top: 47px;} #obtn ._3DMapFunLeft{float: left; width:22%; border:2px solid #f7f8fc; border-right: 0; background: #fff;} #obtn ._3DMapFunLeft .accordion{float:left; width: 100%; height: 653px; overflow-y: auto;} #obtn ._3DMapFunLeft .accordion .li1{float: left; width: 100%;padding: 14px 0 15px 85px;border-bottom: 1px solid #e6e9f0; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } #obtn ._3DMapFunLeft .accordion .li1:last-child{border-bottom: 0;} #obtn ._3DMapFunLeft .accordion .link{float:left; width: 100%; cursor: pointer;color: #444444;font-size: 18px; line-height:50px; position: relative; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } #obtn ._3DMapFunLeft .accordion .link i{position: absolute; width: 17px; height: 17px; background: url("_im_g/exp54_1.png") no-repeat center; left:-32px; top:50%; margin-top: -9px; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } #obtn ._3DMapFunLeft .accordion .li1.open .link i{ background:url("_im_g/exp54.png") no-repeat center; } #obtn ._3DMapFunLeft .accordion .submenu{float: left; width: 100%; display: none;} #obtn ._3DMapFunLeft .accordion .li1.open .submenu{display: block;} #obtn ._3DMapFunLeft .accordion .submenu dd{float: left; width: 100%;} #obtn ._3DMapFunLeft .accordion .submenu dd a{float: left; width: 100%; color:#ffffff; font-size: 15px; line-height: 30px;} #obtn ._3DMapFunLeft .accordion .li1.open{ background:#00b6b5; background: -webkit-linear-gradient(left,#00b6b5,#00d9ad); background: -o-linear-gradient(left,#00b6b5,#00d9ad); background: -moz-linear-gradient(left,#00b6b5,#00d9ad); background: -ms-linear-gradient(left,#00b6b5,#00d9ad); background: linear-gradient(to right,#00b6b5,#00d9ad); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#00b6b5), color-stop(100%,#00d9ad)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b6b5', endColorstr='#00d9ad',GradientType=0); } #obtn ._3DMapFunLeft .accordion .li1.open .link{color:#fff; font-weight: bold;} #obtn ._3DMapFunRight{float: left; width: 78%; line-height: 0; background: #e7e8e8;} @media screen and (max-width:1229px) { #obtn ._3DMapFunctionInfo{margin: 60px 0 90px 0;} #obtn ._3DMapFunLeft .accordion{height: 540px;} #obtn ._3DMapFunLeft .accordion .li1{padding: 14px 0 15px 45px} } @media screen and (max-width:1023px) { #obtn ._3DMapFunctionInfo{margin: 55px 0 70px 0;} #obtn ._3DMapFunLeft{width: 26%;} #obtn ._3DMapFunRight{width: 74%;} #obtn ._3DMapFunLeft .accordion{height: 379px;} #obtn ._3DMapFunLeft .accordion .link{font-size: 16px; line-height: 40px;} #obtn ._3DMapFunLeft .accordion .li1{padding: 10px 0 10px 30px;} #obtn ._3DMapFunLeft .accordion .submenu li a{font-size: 14px; line-height: 26px;} #obtn ._3DMapFunLeft .accordion .link i{left: -25px;} } @media screen and (max-width:767px) { #obtn ._3DMapFunctionInfo{margin: 35px 0 40px 0;} #obtn ._3DMapFunLeft{width: 100%;} #obtn ._3DMapFunctionList{margin-top: 25px;} #obtn ._3DMapFunLeft .accordion .li1{padding: 10px 0 10px 50px} #obtn ._3DMapFunRight{width: 100%;} } #obtn ._3DMapLeft ._3DMapText {float:left;width: 100%;padding: 0;margin: 60px 0;color:#000;} #obtn ._3DMapLeft ._3DMapText dd {float: left;text-align: center;background: #FFF;height: 150px;padding: 33px 0;width:23%;border-radius: 4px;margin-left: 2%;} #obtn ._3DMapLeft ._3DMapText dd:hover {transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; box-shadow: 0 0 27px rgba(152,160,179,0.5); -moz-box-shadow: 0 0 27px rgba(152,160,179,0.5); -webkit-box-shadow: 0 0 27px rgba(152,160,179,0.5);} #obtn ._3DMapLeft ._3DMapText dd:hover img {transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1);} #obtn ._3DMapLeft ._3DMapText dd h3{padding-top: 14px;font-size: 14px;} #obtn ._3DMapLeft ._3DMapText dd span{font-size: 14px;color: #00d6ae;} @media screen and (max-width:767px) { #obtn ._3DMapLeft ._3DMapText {float:left;width: 100%;padding: 0;margin: 10px 0;color:#000;} #obtn ._3DMapLeft ._3DMapText dd {float: left;text-align: center;background:#FFF;height:100px;width: 47%;border-radius: 4px;margin: 3px 0;padding: 15px 0;margin-left: 2%;} #obtn ._3DMapLeft ._3DMapText dd h3{padding-top: 5px;margin: 0 10px} } /* @media screen and (max-width:1769px) {} @media screen and (max-width:1399px) {} @media screen and (max-width:1229px) {} @media screen and (max-width:1023px) {} @media screen and (max-width:767px) {} */ #obtn .FunctionDisplayBox{float: left; width: 100%;background: #69abdf; padding: 73px 0 55px 0;} #obtn .FunctionDisplayBox .pageTit{color:#fff;} #obtn .FunctionDisplayList{float: left; width:100%; background: #ffffff; margin-top: 40px;} #obtn .FunctionDisplayList .lImg{float: left; width: 33.75%; line-height: 0;} #obtn .FunctionDisplayList .rightBox{float: left; width: 66.25%;} #obtn .FunctionDisplayList .rightBox dl{float: left; width: 100%; padding: 40px 0 76px 0;} #obtn .FunctionDisplayList .rightBox dd{float: left; width: 33.333%; text-align: center;cursor: pointer;} #obtn .FunctionDisplayList .rightBox dd .ico{float: left; width: 100%; text-align: center; line-height: 0; margin-top: 33px;} #obtn .FunctionDisplayList .rightBox dd .ico img{ -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } #obtn .FunctionDisplayList .rightBox dd h3{float: left; width: 100%; text-align: center; color:#444444; font-size: 16px; line-height: 32px; height: 64px; margin-top: 8px;} #obtn .FunctionDisplayList .rightBox dd:hover .ico img{ transform:rotateY(360deg) scale(1.1); -ms-transform:rotateY(360deg) scale(1.1); -moz-transform:rotateY(360deg) scale(1.1); -webkit-transform:rotateY(360deg) scale(1.1); -o-transform:rotateY(360deg) scale(1.1); } #obtn .FunctionDisplayBox .FunDisMore{float: left; width: 100%; margin-top: 50px;display: block; text-align: center;} #obtn .FunctionDisplayBox .FunDisMore a{display: inline-block; width: 220px; height: 61px; border:1px solid #fff; color:#fff; line-height: 60px; font-size: 16px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .FunctionDisplayBox .FunDisMore a:hover{background: #58d498; border-color:#58d498;} @media screen and (max-width:1229px) { #obtn .FunctionDisplayList .rightBox dl{padding: 37px 0 50px 0} #obtn .FunctionDisplayList .rightBox dd .ico{margin-top: 20px;} #obtn .FunctionDisplayList .rightBox dd .ico img{width: 50px;} #obtn .FunctionDisplayList .rightBox dd h3{line-height: 31px; height: 62px;} } @media screen and (max-width:1023px) { #obtn .FunctionDisplayBox{padding: 60px 0 55px 0;} #obtn .FunctionDisplayList{margin-top: 35px;} #obtn .FunctionDisplayList .rightBox dl{padding: 20px 0;} #obtn .FunctionDisplayList .rightBox dd .ico{margin-top: 10px;} #obtn .FunctionDisplayList .rightBox dd .ico img{width: 45px;} #obtn .FunctionDisplayList .rightBox dd h3{font-size: 15px; line-height: 26px; height: 52px; margin-top: 5px;} #obtn .FunctionDisplayBox .FunDisMore{ margin-top:35px;} #obtn .FunctionDisplayBox .FunDisMore a{width: 180px; height: 55px;line-height: 55px; } } @media screen and (max-width:767px) { #obtn .FunctionDisplayBox{padding: 35px 0 40px 0;} #obtn .FunctionDisplayList{margin-top: 25px;} #obtn .FunctionDisplayList .lImg{width: 100%; height: 150px; overflow: hidden;} #obtn .FunctionDisplayList .rightBox{width: 100%;} #obtn .FunctionDisplayList .rightBox dd{padding: 0 5px;} #obtn .FunctionDisplayList .rightBox dd h3{font-size: 14px;} #obtn .FunctionDisplayBox .FunDisMore{ margin-top:25px;} #obtn .FunctionDisplayBox .FunDisMore a{width: 160px; height: 45px;line-height: 45px; font-size: 15px;} } /*CSS 分页样式*/ .yemianfenye { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center } .yemianfenye li { margin-top: 20px; width:auto !important;BORDER-RIGHT: #ddd 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #ddd 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #ddd 1px solid; COLOR:#3fc68e; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #ddd 1px solid; TEXT-DECORATION: none } .yemianfenye li A {padding:0px !important; background: #FFF !important; } #videoa,#videob{ display: block;} #videoaa,#videobb{ display: none;} @media(max-width: 768px){ #videoa,#videob{ display: none;} #videoaa,#videobb{ display: block;} } .timgbt{padding-top: 70px;padding-bottom: 20px;color:rgba(255,255,255,0.4);} .timgbt a{color:rgba(255,255,255,0.4);} .timgbt a:hover{color:#58d498;} /***.listen-box{padding-top: 100px!important;overflow: hidden;} .topb{padding-top: 50px!important;overflow: hidden;}**/ /*代理商招募*/ #obtn .recruitBox{float: left; width: 100%; position: relative; background: #f4f4f4;} #obtn .recruitBox .recBg{position: absolute; width: 100%; height: 100%; left: 0; top:0; opacity: 0.1; background: url('_im_g/zm2.jpg') no-repeat center; background-size: cover; z-index: 1} #obtn .deveBox{float: left; width: 100%; position: relative; z-index: 2; padding: 54px 0 62px} #obtn .deveBox .deveText{float: left; width: 52.5%; background: #fff; height: 363px; padding: 38px 30px 26px 40px;} #obtn .deveBox .deveText .h1{float: left; width: 100%; color:#444444; font-size: 28px; line-height: 50px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } #obtn .deveBox .deveText .p1{float: left; width: 100%; color:#777777; font-size: 15px; line-height: 24px; margin-top:30px; max-height: 216px; overflow: hidden;overflow-y:auto;scrollbar-width:thin; } #obtn .deveBox .deveText .p1::-webkit-scrollbar {width:3px} #obtn .deveBox .deveText .p1::-webkit-scrollbar-track{background-color:#e5e5e5;border-radius:3px} #obtn .deveBox .deveText .p1::-webkit-scrollbar-thumb {width:3px;height:60px;background-color:#1878f3;border-radius:3px} #obtn .deveBox .deveImg{float: right; width:47.5%; height: 363px;} @media screen and (max-width:1229px) { #obtn .deveBox .deveText .h1{font-size:30px;} #obtn .deveBox .deveText .p1{font-size: 15px;} } @media screen and (max-width:1023px) { #obtn .deveBox{padding: 45px 0 50px;} #obtn .deveBox .deveText{padding:25px 20px 25px 25px; height: 300px;} #obtn .deveBox .deveText .h1{font-size:26px;} #obtn .deveBox .deveText .p1{font-size: 14px; margin-top: 15px; max-height: 192px;} #obtn .deveBox .deveImg{height: 300px;} } @media screen and (max-width:767px) { #obtn .deveBox{padding:30px 0;} #obtn .deveBox .deveText{padding:15px; height:auto; width: 100%;} #obtn .deveBox .deveText .h1{font-size: 22px; line-height: 35px;} #obtn .deveBox .deveText .p1{max-height: none; margin-top: 10px;} #obtn .deveBox .deveImg{width: 100%; height: 220px;} } #obtn .coopBox{float: left; width: 100%; margin: 52px 0 150px 0;} #obtn .agentTit{float: left; width: 100%; text-align: center; font-size: 28px; line-height: 50px;} #obtn .coopList{float: left; width: 100%; margin-top:40px; display: block; text-align: center;} #obtn .coopList li{display: inline-block; width: 218px; height: 218px; margin:50px 7% 0 7%; transform:rotate(45deg); -ms-transform:rotate(45deg); -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); background: #4760ff; background: -webkit-linear-gradient(top,#4760ff,#0dccff); background: -o-linear-gradient(top,#4760ff,#0dccff); background: -moz-linear-gradient(top,#4760ff,#0dccff); background: -ms-linear-gradient(top,#4760ff,#0dccff); background: linear-gradient(to bottom,#4760ff,#0dccff); background: -webkit-gradient(linear, top left, top right, color-stop(0%,#4760ff), color-stop(100%,#0dccff)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0f0', endColorstr='#17e8be',GradientType=0); } #obtn .coopList li .copIco{float: left; width: 100%; height: 100%; color:#fff;font-size: 16px; line-height: 30px; display: table; transform:rotate(-45deg); -ms-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -o-transform:rotate(-45deg); } #obtn .coopList li .copIco .table{display: table-cell; vertical-align: middle;} #obtn .coopList li .copIco .tIco{float: left; width: 100%; text-align: center; margin-top: -25px;} #obtn .coopList li .copIco .tIco img{width: 60px; height: 60px;} #obtn .coopList li .copIco .p1{float: left; width: 100%;} #obtn .coopList li:nth-child(4), #obtn .coopList li:nth-child(5){margin:-45px 7%;} @media screen and (max-width:1229px) { #obtn .agentTit{font-size: 30px;} #obtn .coopList li{width: 180px; height: 180px;} #obtn .coopList li .copIco{font-size: 18px; line-height: 28px;} #obtn .coopList li .copIco .tIco img{width: 50px; height: 50px;} } @media screen and (max-width:1023px) { #obtn .agentTit{font-size: 26px;} #obtn .coopBox{margin: 40px 0 120px 0} #obtn .coopList{margin-top: 30px;} #obtn .coopList li{width: 150px; height: 150px; margin: 30px 6% 0 6%;} #obtn .coopList li:nth-child(4), #obtn .coopList li:nth-child(5){margin: -35px 6%} #obtn .coopList li .copIco{font-size: 15px; line-height: 26px;} #obtn .coopList li .copIco .tIco{margin-top: -10px;} #obtn .coopList li .copIco .tIco img{width: 40px; height: 40px;} } @media screen and (max-width:767px) { #obtn .agentTit{font-size: 22px; line-height: 35px;} #obtn .coopBox{margin: 30px 0;} #obtn .coopList{margin-top: 10px;} #obtn .coopList li{float: left; width: 48%; margin:10px 2% 0 0; transform:rotate(0deg); -ms-transform:rotate(0deg); -moz-transform:rotate(0deg); -webkit-transform:rotate(0deg); -o-transform:rotate(0deg); } #obtn .coopList li .copIco{font-size: 14px; transform:rotate(0deg); -ms-transform:rotate(0deg); -moz-transform:rotate(0deg); -webkit-transform:rotate(0deg); -o-transform:rotate(0deg); } #obtn .coopList li:nth-child(4), #obtn .coopList li:nth-child(5){margin:10px 2% 0 0;} #obtn .coopList li:nth-child(2n){margin: 10px 0 0 2%;} #obtn .coopList li .copIco .tIco{margin-top: 0;} } #obtn .supportBox{float: left; width: 100%; position:relative; background: #1f3472;} #obtn .supportBg{float: left; position: absolute; width: 100%; height: 100%; left: 0; top:0; opacity: 0.47; z-index: 1;} #obtn .supportText{float: left; width: 100%; margin: 52px 0 72px 0; position: relative; z-index: 2;} #obtn .agentTit.white{color:#fff;} #obtn .supportList{float: left; width: 100%; margin-top: 50px;} #obtn .supportList li{float: left; width: 25%; height: 403px; position: relative; cursor: pointer;} #obtn .supportList li .goodBg{position: absolute; width: 100%; height: 100%; left: 0; top:0; background: #15255c; opacity: 0.68; z-index: 1; } #obtn .supportList .goodBox{float: left; width: 100%; height: 100%; display: table; position: relative; z-index: 2;} #obtn .supportList .goodBox .table{display: table-cell; vertical-align: middle;} #obtn .supportList .tIco{float: left; width: 100%; text-align: center; padding-bottom: 21px; position: relative} #obtn .supportList .tIco:after{position: absolute; content: ''; width: 20px; height: 2px; left: 50%; margin-left: -10px; bottom: 0; background: #fff;} #obtn .supportList .tIco img{width: 55px; height: 55px;} #obtn .supportList .hTit{float: left; width: 100%; text-align: center; font-size: 22px; color:#fdfcfc; line-height: 30px; margin-top: 13px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } #obtn .supportList .p1{float: left; width: 100%; padding: 0 10%; color:#fff; font-size: 16px; line-height:24px; margin-top: 24px; max-height:144px; overflow: hidden; height: 0; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } #obtn .supportList li:hover .goodBg{ opacity: 0.87; background: #4760ff; background: -webkit-linear-gradient(top,#4760ff,#0dccff); background: -o-linear-gradient(top,#4760ff,#0dccff); background: -moz-linear-gradient(top,#4760ff,#0dccff); background: -ms-linear-gradient(top,#4760ff,#0dccff); background: linear-gradient(to bottom,#4760ff,#0dccff); } #obtn .supportList li:hover .hTit{color:#fff;} #obtn .supportList li:hover .p1{height: auto;} @media screen and (max-width:1023px) { #obtn .supportText{margin: 45px 0 65px 0;} #obtn .supportList{margin-top:35px;} #obtn .supportList li{height: 350px;} #obtn .supportList .tIco img{width: 45px; height: 45px;} #obtn .supportList .hTit{font-size: 18px;} #obtn .supportList .p1{font-size: 14px; margin-top: 15px;} } @media screen and (max-width:767px) { #obtn .supportText {margin: 35px 0;} #obtn .supportList{margin-top: 25px;} #obtn .supportList li{width: 50%; height: 300px;} #obtn .supportList .tIco{padding-bottom: 15px;} #obtn .supportList .tIco img{width: 40px; height: 40px;} #obtn .supportList .hTit{margin-top: 7px; font-size: 16px;} } #obtn .termGrey{float: left; width: 100%; background: #f4f4f4; padding: 52px 0 60px 0;} #obtn .termLeft{float:left; width:32.5%; text-align: right;} #obtn .termLeft dl{float: left; width: 100%; margin-top: 40px; padding-right: 115px; height: 145px; display: table; position: relative;} #obtn .termLeft dl .ico{position: absolute; right: 0; width: 76px; height: 87px; top:50%; margin-top: -44px;} #obtn .termLeft dl .table{vertical-align: middle; display: table-cell;} #obtn .termLeft dl dt{float: left; width: 100%;color:#444444; font-size: 22px;line-height: 30px;} #obtn .termLeft dl dd{float: left; width: 100%; font-size: 16px; color:#777777; line-height: 24px; margin-top: 10px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; } #obtn .termLeft.right{text-align: left; float: right;} #obtn .termLeft.right dl{padding-left: 115px; padding-right: 0;} #obtn .termLeft.right dl .ico{right: auto; left: 0;} #obtn .termImg{float:left; width: 35%; text-align: center; margin-top: 40px; line-height: 330px;} #obtn .termImg img{vertical-align: middle; margin-top: -10px;} @media screen and (max-width:1229px) { #obtn .termLeft dl{padding-right: 105px;} #obtn .termLeft.right dl{padding-left: 105px;} #obtn .termLeft dl dt{font-size: 20px;} #obtn .termLeft dl dd{font-size: 15px;} } @media screen and (max-width:1023px) { #obtn .termGrey{padding: 45px 0 50px 0;} #obtn .termLeft dl{margin-top: 30px;padding-right: 85px; height: 120px;} #obtn .termLeft.right dl{padding-left:85px;} #obtn .termLeft dl .ico{width: 60px; height: 68px; margin-top: -34px;} #obtn .termLeft dl dd{font-size: 14px; line-height: 22px;} #obtn .termImg{margin-top: 30px; line-height: 270px;} #obtn .termImg img{width: 130px;} } @media screen and (max-width:767px) { #obtn .termGrey{padding: 35px 0;} #obtn .termLeft{width: 100%; text-align: left;} #obtn .termImg{display: none;} #obtn .termLeft dl{margin-top: 10px; height: 100px;padding-left: 75px; padding-right:0;} #obtn .termLeft.right dl{padding-left:75px;} #obtn .termLeft dl .ico{left: 0; right: auto;} #obtn .termLeft dl dt{font-size: 18px;} #obtn .termLeft dl dd{margin-top: 5px;} } #obtn .zmContactBox{float: left; width: 100%; position: relative; background: #0945bc;} #obtn .zmBlue{position: absolute; left: 0; top:0; width: 100%; height: 100%; opacity: 0.3; z-index: 1;} #obtn .zmConText{float: left; width: 100%; padding: 50px 75px; position: relative; z-index: 2;} #obtn .zmConText .linkBox{float: left; width: 100%; margin-top: 40px; position: relative} #obtn .zmConText .linkBox:after{position: absolute; content: ''; width: 1px; height: 78px; top:50%; margin-top: -39px; background: #fff; opacity: 0.38; left: 50%;} #obtn .zmConText .linkBox .li1{float:left; width: 50%; position: relative; line-height: 78px; color:#fff; font-size: 22px; display: block;} #obtn .zmConText .linkBox .li1:nth-child(2){text-align:right;} #obtn .zmConText .linkBox .li1 .ico{display: inline-block; width: 78px; height: 78px; vertical-align: top;} #obtn .zmConText .linkBox .li1 span{display: inline-block; vertical-align: top; margin-left: 50px;} #obtn .zmConText .more{float: left; width: 100%; display: block; text-align: center; margin-top: 70px;} #obtn .zmConText .more a{display: inline-block; width: 180px; height: 50px; margin:0 10px;border:2px solid #fff; border:2px solid rgba(255,255,255,0.6); text-align: center; line-height: 46px; color:#fff; font-size: 18px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #obtn .zmConText .more a:hover{background: #fff; background: rgba(255,255,255,0.95); color:#2cd182} @media screen and (max-width:1229px) { #obtn .zmConText{ padding: 50px 0;} } @media screen and (max-width:1023px) { #obtn .zmConText{padding:35px 0 40px 0;} #obtn .zmConText .linkBox{margin-top: 30px;} #obtn .zmConText .linkBox .li1{text-align: center; font-size: 18px;line-height: 50px;} #obtn .zmConText .linkBox .li1 span{width: 100%; margin-left: 0;} #obtn .zmConText .linkBox .li1:nth-child(2){text-align: center;} #obtn .zmConText .more{margin-top: 40px;} #obtn .zmConText .more a{height: 45px; line-height: 41px;} } @media screen and (max-width:767px) { #obtn .zmConText{padding: 30px 0 35px 0} #obtn .zmConText .linkBox{margin-top: 10px;} #obtn .zmConText .linkBox:after{display: none;} #obtn .zmConText .linkBox .li1{width: 100%;line-height: 40px; text-align: left; margin-top: 10px;} #obtn .zmConText .linkBox .li1:nth-child(2){text-align: left;} #obtn .zmConText .linkBox .li1 .ico{width: 40px; height: 40px;} #obtn .zmConText .linkBox .li1 span{width:auto; margin-left: 10px;} #obtn .zmConText .more{margin-top:25px;} #obtn .zmConText .more a{font-size: 16px;width: 140px;height: 40px;line-height: 36px;} } #obtn .menu .nli.active span a:after, #obtn .menu .nli.on span a:after, #obtn .menu .nli span:hover a:after{height: 4px;} /**624**/ .infoTit{width: 100%;text-align: center;color: #444444;font-size: 36px;line-height: 60px;margin-bottom: 2em;letter-spacing:5px;} .h1Tit{margin-top:2em;margin-bottom:3em;} .flex{display:flex;} .flex1{display: flex;justify-content: center; padding-bottom: 30px;} .kj-cases1{margin-top: -50px;} .kj-cases1 ul{ width: 100%; float: left; justify-content: space-between; flex-wrap: wrap; margin-top: 20px; } .kj-cases1 ul li{ width: 23%; background-color: #FFFFFF; margin-top: 15px; text-align: center; border: #dedede 1px solid; } .kj-cases1 ul li i{ display: block; padding: 10px 0; background-color: #fff; box-sizing: border-box; } .kj-cases1 ul li i img{ display: block; margin: 0 auto; max-width: 100%; max-height: 100px; object-fit: cover; } .kj-cases1 ul li p{ text-align: center; font-size: 15px; height: 40px; line-height: 40px; background-color: #f7f7f7; border-top: #dedede 1px solid; } .Service_info ul li{width: 35%;border: 2px #929292 dashed;padding:1.8em;text-align: center;position: relative;/* margin-left: 30px; */} .Service_info ul li i{ font-style: italic; color: #184197; font-size: 3.6em; position: absolute; top: -1.2em; left: 30%; background-color: #fff; padding: .2em 1em; } .Service_info ul li p{ line-height: 1.7em; } @media(max-width: 800px){ .Service_info ul li{ width: 49%; } } @media(max-width: 480px){ .flex{ flex-wrap: wrap; } .flex li p{ text-align: center; padding: 0px 3%; text-align: justify; } .flex li b{ text-align: center; padding-top: 10px; } .Service_info ul li{ width: 100%; margin-bottom: 3em; } .Service_info ul li:first-child{ margin-bottom: 3em; } .flexzuo { margin-right:0% !important; } .Service_info ul li i {font-size: 2.2em; left: 38%;} .application ul li {width:100% !important;} } .MapBg{ background: url(/template/eyou/pc/_im_g/mapbg.png) no-repeat; background-size: 100% 100%; } .myself_style ul{ align-items: center; } .myself_style li:first-child{ width: 44%; } .myself_style li:last-child{ width: 60%; line-height: 2em; } .myself_style li:last-child b{ font-size: 1.8em; display: block; margin-bottom: .5em; font-weight: normal; } .myself_style li:last-child p{ width: 80%; } @media(max-width: 480px){ .myself_style li:first-child{ width: 100%; margin: 0 auto 1em; } .myself_style li:last-child{ width: 100%; } .infoTit {font-size: 28px;line-height: 30px;margin-bottom: 1.6em;} .wbmap{font-size: 24px !important;} .myself_style li:last-child p{width: 100%;} .flexleft {padding-left: 0% !important;} } .ModelBg{ background: url(/template/eyou/pc/_im_g/modebg.png) no-repeat; background-size: 100% 100%; } .Model ul{ flex-direction: row-reverse; } .application ul li{ width: 49%; border: none; } .application span img{ width: 79px; display: block; margin: 0 auto 1.5em; } .application b{ display: block; font-size: 1.5em; margin-bottom: 1em; font-weight: normal; } .application ul li p{ line-height: 1.7em; width: 100%; padding-left: 1%; } @media(max-width: 480px){ .application ul li:first-child{ width: 100%; margin-bottom: 0; } .application ul li:last-child{ width: 100%; } .application span img{ width: 12%; } } .effectbg{ background: url(/template/eyou/pc/_im_g/effectbg.jpg) no-repeat; background-size: 100% 100%; } .flexzuo{margin-right: 5%;} .wbmap{font-size: 32px !important;letter-spacing: 3px;} .flexleft{padding-left: 10%;} #obtn .proTableBox .proDt .dd.lin1,#obtn .proTableBox .proDl .dd.lin2{display:flex; flex-wrap:wrap;} #obtn .proTableBox .proDt .dd.lin1 span:first-child,#obtn .proTableBox .proDl .dd.lin2 div:first-child{ border-bottom:1px solid #e5e5e5;} #obtn .proTableBox .proDl .dd.lin2 div{ width:100%}